vue项目:新增时清除表单验证注意事项

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue项目:新增时清除表单验证注意事项相关的知识,希望对你有一定的参考价值。

参考技术A // 清除表单校验的提示
if (this. nextTick(function ()
this.$refs['XXX'].clearValidate();
)
;

// this.$nextTick()函数作用是等页面的数据更新完成以后,它再执行内部回调函数中的逻辑

Vue处理表单校验

参考技术A 1、vue使用element-ui的form表单验证

问题描述:第一次点击新增时正常,第二次新增打开弹窗后由于表单内容为空,出现验证这种情况。

解决 : this.$refs.staffForm.resetFields();//等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields(),去除验证(clearValidate),(resetField表单重置)

//打开弹窗的新增方法

addStaff()

      this.staffVisible = true;//弹窗打开

      this.$nextTick(()=>

         this.$refs.staffForm.resetFields()

        this.$refs.staffForm.clearValidate()

      );

,

以上是关于vue项目:新增时清除表单验证注意事项的主要内容,如果未能解决你的问题,请参考以下文章

VUE项目实战28.实现添加用户功能-预校验与发起新增请求

关于vue项目中表格所遇到的问题

Vue处理表单校验

vue+elementui 封装表单验证

vue + ElementUI 关闭对话框清空验证,清除form表单

vue element ui 实现动态表格/表单(新增/删除行)