Element Ui 关闭对话框清空验证消息，清除form表单的操作
- 首先在对话框 取消按钮 添加 click事件，例如：（ps：callOf 里面的addGroupData和ref - - ）
<div slot="footer" class="dialog-footer"><el-button @click="callOf('addGroup')">取消</el-button>
</div>
- 点击取消按钮，关闭对话框，清除表单验证
callOf(formName){this.creatGroup = false;this.$refs[formName].resetFields();
}
- 对话框右上角的close按钮
before-close：关闭前的回调，会暂停Dialog的关闭，function(done)，done用于关闭Dialog。location.reload：刷新整个页面
closeDialog(done){done();location.reload();
}
方法2
增加 ref 属性
<el-form ref="formData"></el-form>
// Element UI 自带清除表单方法
this.$refs[formName].resetFields(); // 重置表单移除校验
this.$refs[formName].clearValidate(); // 仅清除验证
Vue表单报错 Error in event handler for “click” : "TypeError:Cannot read property ‘resetFields’ of undefined"
报错原因 mouted加载数据以后，隐藏的弹出框并没有编译渲染进 DOM 里面。所以 click 弹出的时候 $refs 并没有获取到 DOM元素导致 ‘resetFields of undefined’
解决办法: 可以用 this.nextTick() ，将回调延迟到下次DOM更新循环之后执行this.refs[formName].resetFields() / clearValidate():清空验证
this.$nextTick(()=>{this.$refs.addForm.resetFields();// or this.$refs.addForm.clearValidate();
})
