微信小程序提交表单后清空 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 个评论

要回复文章请先登录注册