uniapp-表单提交后请清空表单

第一种  通过v-model=""的动态清空

<form @submit="formSubmit" >
<view>
<input type="text" value="" v-model="test" name="test" />
<button form-type="submit">Submit</button>
</view>
</form>

formSubmit(e) {
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
this.test = '';
}

第二种  通过reset按钮来动态清除，而不是直接点击来实现, H5端的

<form @submit="formSubmit" @reset="formReset">
<view>
<button form-type="submit">Submit</button>
<button form-type="reset" ref="resrtBtn" style="display:none;">Reset</button>
</view>
</form>

formSubmit(e) {
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
this.$refs.resrtBtn.$dispatch('Form', 'uni-form-reset', {
type: 'reset'
})
}

第三种  就是通过手动的reset按钮来清除

<form @submit="formSubmit" @reset="formReset">
<view>
<button form-type="submit">Submit</button>
<button form-type="reset" ref="resrtBtn" >Reset</button>
</view>
</form>

formReset(e) {
console.log('form发生了reset事件)
}

最后

以上就是无私信封为你收集整理的uniapp-表单提交后请清空表单的全部内容，希望文章能够帮你解决uniapp-表单提交后请清空表单所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。