微信小程序提交表單清空輸入框

這裏簡單記錄兩種方法：
一、在input中綁定對象value，在提交成功後的回調中重新設置值爲空。個人覺得這種方式適合表單數據比較少。
wxml代碼

<form bindsubmit="submitForm">
    <input name="title"  maxlength="20" value="{{title}}" />
    <input name="txt"  value="{{txt}}" />
    <button  formType="submit">提交</button>
<form>

js代碼

submitForm: function(e) {
  var that = this;
  var formData = e.detail.value;
  wx.request({
    url: apiurl,  //你要提交的接口
    data: formData,
    header: { 'Content-Type': 'application/json' },
    success: function (res) {
      if (res.data.status == 200) {
        wx.showToast({
          title: '提交成功',
        })
        that.setData({
          title: '',
          txt: ''
        })
      }
    }
  })
}

二、通過表單reset重置事件，不過這種方式不能直接使用form表單爲我們提供的submit方法中的 e.detail.value提交數據。所有我們要利用input的bindinput或bindblur事件來獲取表單數據，將數據setData保存下來。然後就可以用formReset方法將保存的數據傳到後臺。但是在提交之前要注意的一點，就是要檢查下數據是否爲空和數據格式是否符合規定。

<form bindreset="formReset">
  <input name="title" data-name="title" maxlength="20" bindblur="getData" />
  <input name="txt" data-name="txt" bindblur="getData" />
  <button  formType="reset">提交</button>
</form>

js代碼

data:{
    cont:{
      title: "",
      txt: ""
    }
  },
  getData:function(e){
    //console.log(e)
    var name = e.currentTarget.dataset.name;
    this.data.cont[name] = e.detail.value;
    this.setData({
      cont: this.data.cont
    })
    console.log(this.data.cont)
  },
  formReset:function(e){
    //在此將保存的表單數據傳遞給後臺
  }