小程序textarea,软键盘的缩回影响了页面Data更新
- 当前 Bug 的表现(可附上截图)
真机环境,点击textarea输入框,弹出软键盘,输入消息,点击发送按钮,textarea的输入框内消息没清空,再次点击发送,消息才清空。总结原因:发送消息成功,软键盘缩回时阻止了页面data的更新。
- 预期表现
实际在点击发送时,消息this.setData({message:“”}) ,message已经被设置为空,消息应该清空,这个在测试环境表现一切正常,没有软件盘时,点击发送也正常,均能清空消息;
真机环境因为有软键盘的弹出,点击发送软键盘缩回,消息发送成功,但是页面的data数据未及时更新。导致textarea依然是发送前的值。
-
复现路径
-
提供一个最简复现 Demo
index.wxml
<textarea id="message-textarea" class="message-textarea" bindlinechange="bindTextAreaChange" show-confirm-bar="" fixed="true" cursor-spacing="0" selection-start="-1" selection-end='-1' bindinput="bindTextAreaInput" value='{{message}}' /><button class="sendBtn" bindtap="sendMsg">发送</button> |
index.js
Page({ data: { message: '', }, bindTextAreaInput: function(e) { this.setData({ message: e.detail.value }) }, sendMsg: function() { this.setData({ message:"" }); },}) |
