vue 表单重置功能
vue 表单重置功能
·
针对vue重置form表单,总结了一下
1、<el-form>标签加上ref属性,名称自定义,我这里起了searchForm
<el-form ref="searchForm"></el-form>
2、表单项<el-form-item>标签没有添加prop属性,prop属性需要与input框绑定v-model的属性一致
<el-form-item label="名称" prop="name">
<el-input v-model="searchForm.name" placeholder="请输入"></el-input>
</el-form-item>
3、需要注意的是:resetField()方法不是将表单重置为空,而是重置为初始值
如下写法只适合清空当前页面未提交的表单,如果提交了表单,再打开当前表单,表单内容还会显示出来
resetSearchForm() {
this.$refs['searchForm'].resetFields()
}
还需要在打开表单的时候对绑定的值重新赋空值
this.searchForm.name= '';
更多推荐
已为社区贡献1条内容
所有评论(0)