Vue处理表单校验

1、vue使用element-ui的form表单验证

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


Vue处理表单校验_第1张图片

解决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处理表单校验)