ion-textarea 在 Ionic 5 中动态调整高度

Question

我正在将我的项目从 Ionc3 迁移到 Ionic5。我有一个 ion-textarea ，它会随着用户键入而增加高度，并且它在 Ionic3 中工作。以下是代码。

HTML 页面：

<ion-textarea #hvUserPost type="text" (input)="adjustDesc()"></ion-textarea>

TS页面：

@ViewChild('hvUserPost') hvUserPost: ElementRef;
adjustDesc() {
    let textArea;
    textArea = this.hvUserPost['_elementRef'].nativeElement.getElementsByClassName("text-input")[0];
    textArea.style.overflow = 'hidden';
    textArea.style.height = 'auto';
    var scrollHeight = textArea.scrollHeight;
    textArea.style.height = scrollHeight + 'px';
}

现在在 Ionic4 中唯一改变的是以下声明

@ViewChild('hvUserPost', {static: false}) hvUserPost: ElementRef;

在 Ionic4 中，我收到以下错误。

ERROR TypeError: Cannot read property 'nativeElement' of undefined

所以this.hvUserPost['_elementRef']是未定义的，this.hvUserPost.nativeElement也是未定义的。

Answer 1

只需添加 autoGrow="true" atteibute 即可完成。

<ion-textarea #hvUserPost type="text"autoGrow="true" (input)="adjustDesc()"></ion-textarea>