正文
都 2021 年了，微信小程序 textarea 组件还是那么多问题，兼容性问题在 Android 机型（特别是低配置的）上尤为突出...
假设组件如下：
<textarea name="postalAddress" id="postalAddress" rows="3" bindinput="inputEvent" bindblur="blurEvent" bindfocus="focusEvent" class="textarea" value="{{postalAddress}}" placeholder-class="input-placeholder" placeholder="请输入" confirm-type="done" disable-default-padding="{{true}}" cursor-spacing="50" show-confirm-bar="{{false}}" auto-height="{{true}}" maxlength="60" />
这里就有好多问题...
1. show-confirm-bar 的问题
测试同学发现在红米 4X 上，textarea 组件的“完成”一栏不透明度不是 100%，导致文案与底下文案重叠。然后就想着设成 show-confirm-bar="{{false}}" 来隐藏“完成”栏。
好家伙，新 Bug 又来了。当设置之后，在 Android 上首次聚焦输入框时，会失焦（自动收起键盘）。然后我是这样解决这个 Bug 的：
该 Bug 属于外部原因，小程序组件本身的问题无法解决，所以不作处理。(又解决了一个问题，开心 )
社区相关问题：
2. auto-height 的问题
属性 auto-height="{{true}}" 愿意是想根据内容自适应高度，以提高用户体验。可现实是，用户体验没提高，倒是提高了开发者的开发难度。TMD 又是 Android 机型的问题，在用户失焦之后，textarea 会多了一大部分的空白部分，用户体验倒是没提高，反而出现 Bug 了，擦。
解决方案：去掉
auto-height属性，使用 CSS 控制min-height属性。
3. disable-default-padding 的问题
假设我们的设计稿是这样的，多行输入框与其他元素左边对齐，但由于 iOS 上会有个默认的内边距，即使 CSS 设置了 padding-left 等属性也没效果。可以添加一个 disable-default-padding="{{true}}" 属性解决。
4. textarea 原生组件的问题
由于原生组件的特（niao）性，在未支持原生组件同层渲染之前，类似 textarea 等原生组件层级是最高的，无论其他标签设置的 z-index 有多大，均无法覆盖原生组件，唯一解决的方法是使用 cover-view、cover-image 等组件包裹原生组件，但是本身 cover-view 等就一身毛病，它 TM 烦了，毫无开发体验。
关于原生组件，可看文档 native-component。
结合以上问题，于是改成这样子：
<textarea name="postalAddress" id="postalAddress" rows="3" bindinput="inputEvent" bindblur="blurEvent" bindfocus="focusEvent" class="textarea" value="{{postalAddress}}" placeholder-class="input-placeholder" placeholder="请输入" confirm-type="done" disable-default-padding="{{true}}" cursor-spacing="50" maxlength="60" />
The end.
