vue+element-ui 的表单重置验证问题

clipboard.png
1、这是一个vue弹出层
2、如图,element-ui【如何把已经触发的验证在点关闭按钮的时候取消掉】。

===============================
2018.03.13更新一下

1、重置样式的请看采纳的回答
2、当提交成功的时候可以执行下面重置的语句,来重置一下。解决了提交成功的时候,再次点击没有重置的问题。
this.$refs['Form'].resetFields()

===============================
2018.08.24更新

亲测可用,感谢
this.$refs['Form'].clearValidate() // 重置验证

阅读 28.2k
6 个回答
  1. 使用 this.$refs 而不是 this.$ref
  2. 配合使用 this.$nextTick(() => {})
  3. el-form 中的 model / ref 以及 el-form-item 中的 prop 再检查一遍吧

2020年6月30日 10:55:49

我之前也做过类似的,在点击关闭的时候,如1/2楼所说,给form加一个ref属性,然后在取消事件里面写this.$refs['refname'].resetFields()。也可以在当弹出层刚打开的时候,this.$refs['refname'].resetFields(),也能达到效果

新手上路,请多包涵

你给form加一个ref属性 = refname;
模态框打开的事件添加 以下代码即可.
this.$nextTick(() => { //等待dom同步后打开模态框
this.$refs['refname'].resetFields(); //此方法需要模态框加载完成后才可以执行
})

this.$refs.form.reset()

像一楼写的那样,你给form加一个ref属性,然后在取消事件里面写this.$refs['refname'].resetFields()

应该用 clearValidate ,ref 引出表单实例,在js中调那个方法

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题