mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-17 10:41:13 +08:00
feat(textarea): add option to expand textarea as value changes (#16916)
* feat(textarea): add autoGrow - set height to scrollHeight * change 1px to inherit, remove additional 4px
This commit is contained in:

committed by
Liam DeBeasi

parent
669ec0da3d
commit
cc8678ad58
@ -119,6 +119,11 @@ export class Textarea implements ComponentInterface {
|
||||
*/
|
||||
@Prop() wrap?: 'hard' | 'soft' | 'off';
|
||||
|
||||
/**
|
||||
* If `true`, the element height will increase based on the value.
|
||||
*/
|
||||
@Prop() autoGrow = false;
|
||||
|
||||
/**
|
||||
* The value of the textarea.
|
||||
*/
|
||||
@ -134,6 +139,7 @@ export class Textarea implements ComponentInterface {
|
||||
if (nativeInput && nativeInput.value !== value) {
|
||||
nativeInput.value = value;
|
||||
}
|
||||
this.runAutoGrow();
|
||||
this.emitStyle();
|
||||
this.ionChange.emit({ value });
|
||||
}
|
||||
@ -183,9 +189,18 @@ export class Textarea implements ComponentInterface {
|
||||
componentDidLoad() {
|
||||
this.debounceChanged();
|
||||
|
||||
this.runAutoGrow();
|
||||
|
||||
this.ionInputDidLoad.emit();
|
||||
}
|
||||
|
||||
private runAutoGrow() {
|
||||
if (this.nativeInput && this.autoGrow) {
|
||||
this.nativeInput.style.height = 'inherit';
|
||||
this.nativeInput.style.height = this.nativeInput.scrollHeight + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
componentDidUnload() {
|
||||
this.ionInputDidUnload.emit();
|
||||
}
|
||||
|
Reference in New Issue
Block a user