vue中form验证

一、问题

在开发中有这样一个需求，单击按钮会弹窗，填写表单后，触发验证提示信息。关闭弹窗后，在次打开，验证提示信息还会存在。这种不是太友好，所以在弹窗后，手动清除上一次的验证提示信息。

二、解决方案

1.清除表单内容和清除表单验证消息

  this.$nextTick(()=>{
    this.$refs['testForm'].resetFields();
  })

2.只清除表单验证消息，不清除表单内容

  this.$nextTick(()=>{
    this.$refs['testForm'].clearValidate() 
  })

3.清除表单验证消息不起作用时，可尝试

  setTimeout(() => {
    this.$refs["testForm"].clearValidate();
  }, 30);

 

 

tips: testForm 是指当前表单绑定的对象

<el-form ref="testForm" :model="testForm"/>

 

参考---https://www.csdn.net/tags/MtjaggwsODQzNjgtYmxvZwO0O0OO0O0O.html