微信小程序提交表单后清空 input 输入框的值

开发微信小程序时,会使用到表单提交,也就有可能会涉及到小程序的input组件。例如评论留言功能。


而在评论成功后,我们提交成功后还需要将 input 输入框的值清空。


在网上看到有网友分享了如下方式:


在 你的模板页面 xxx.wxml 内,设置input组件中 value 值为 inputValue。就可以在事件中通过 setData,动态更改 inputValue 的值。






清除评论内容

// xxx.js
Page({
data: {
inputValue: null,
},

  clearInputEvent: function(res) {
this.setData({
'inputValue': ''
})
}

})


但是操作后会发现input的值还是不会跟着清空,
后来发现设置了一个延时后就可以清空。


                //清空文本框上的内容
setTimeout(() => {
this.setData({
'inputValue': ''
})
}, 10)

如果这样修改,在开发者工具中不能清空小程序input组件的值,那么你可以试试在真机上操作,有可能只是开发者工具的问题,真机上是可以清空的。


同样的道理,这个方法也可以用来清空小程序textarea组件的值。


如果你使用的是uniapp,那么只需要这样就可以清空小程序input的值,清空小程序textarea组件的值也适用



                //清空文本框上的内容
setTimeout(() => {
this.inputValue = ""
}, 10)

0 个评论

要回复文章请先登录注册