ion-textarea autoGrow="true" 模式，仅第一次工作答案

【问题标题】：ion-textarea autoGrow="true" on modal, work only the first timeion-textarea autoGrow="true" 模式，仅第一次工作
【发布时间】：2021-05-07 05:15:41
【问题描述】：

我在 ionic 4.4 中引入的 ion-textarea autoGrow="true" 有一个奇怪的行为，这是第一次正确制作 autoGrow。第二次 textarea 小于 1 行。我们无法看到文本。

第一次：

第二次：

我这样打开模态

 displayModal(data) {
this.modalCtrl.create({
  component: EventDetailModalComponent, componentProps: {
    event: data.appointmentData,
    timeFormat: this.timeFormat,
    dateFormat: this.dateFormat
  }
}).then(modalElement => {
  modalElement.present();
});  }

然后像这样关闭：

   onCancel() { this.modalCtrl.dismiss(); }

视图包含：

 <ion-item lines="none">
        <ion-label position="floating">{{'DESCRIPTION' | translate }}</ion-label>
        <ion-textarea readonly disabled autoGrow="true" class="ion-text-justify" value="{{ description }}" ></ion-textarea>
 </ion-item>

关于信息，文本是由程序手动插入 value="x" 中的，而不是用户输入的。

我正在运行最后一个版本的 ionic ("@ionic-native/core": "^5.11.0") 和 Angular (8.2)。

在 Mac 上的最新版本 Chrome、Safari 和 FireFox 上测试过同样的问题。

【问题讨论】：

你好，请看：stackblitz.com/edit/ionic-v4-angular-ion-textarea-autogrowth第一次点击：“TEST MODAL HERE”，你会有一个正确的“lorem ipsum”，然后关闭，再重新打开，你就差不多了看不到文字。
有趣。如果它不是模态的，似乎可以正常工作，是的。在我看来有点像虫子。也许将其报告为 ionic 的错误？
有关信息已报告给 ionic 团队：github.com/ionic-team/ionic/issues/18993

标签： angular ionic-framework ionic4

【解决方案1】：

nd::deep 已弃用

https://angular.io/guide/component-styles#deprecated-deep--and-ng-deep

在 global.scss 中添加这个对我有用

ion-textarea {
    min-height: 40px;
    textarea {
        min-height: 40px;
    }
}

【讨论】：

不适合我

【解决方案2】：

您可以像这样在 ion-textarea 的 textarea 子元素上设置最小高度

::ng-deep textarea {
    min-height: 45px;
}

【讨论】：