textarea 聊天输入框高度自适应问题
用微信小程序的组件 textarea 写聊天输入框的时候遇到以下几个问题:
- 使用
bindlinechange
监视行数变化时,若使用 event.detail.heightRpx,在开发工具中调试没什么问题,但是在真机调试的时候会出现不换行
问题出现在真机调试的时候无法获取属性 heightRpx
,我们可以看看打印了什么
中间是 heightRpx
的值,发现我们并未获取到,这应该算是一个 bug 吧,所以我们应该换种方法思考:
在 CSS 中,我们将 font-size = 38rpx
,那么我们自己计算 heightRpx = 38rpx * lineCount
, 这样即可计算出高度
- 真机调试聚焦的时候,键盘会挡住输入框
解决方法就是给元素加上属性 cursor-spacing="20"
- 微信小程序提供的属性中,
show-confirm-bar="false"
无用问题
这个问题很抽象,翻开发者社区找到解决方案:改为 show-confirm-bar="{{false}}"