在dialog中重置表单的方法
在 dialog取消按钮或者在对话框关闭的
before-colse事件中添加：
closeDiglog(){
//$nextTick()是一个异步事件
//弹出窗口打开之后,需要加载DOM,所以不用异步事件,获取不到表单DOM
this.$nextTick(()=>{
//清空验证
this.$refs['Form'].clearValidate();
//清空表单
this.$refs['Form'].resetFields()
})
}
注意:清空表单一定要给el-form-item添加prop属性,不然重置表单无效
<el-form-item label="申请人身份证" prop="id_num">
上面为一种清空方式
还有种清空方式为 ：
<el-dialog
:close-on-click-modal="false"
:title="dialogTitle"
:visible.sync="dialogFormVisible"
@close="closeDialog">
</el-dialog>
<!-- ↑监听dialog关闭事件,进行表单清空,无需异步 -->
最简单粗暴就是在dialog对话框添加v-if，下次打开对话框重新渲染即可。
<el-dialog
title="事项受理"
v-if="dialogFormVisible"
close-on-press-escape
:before-close="closeDiglog"
width="430px"
>
dialog中表单resetFields并没有清空表单
常见的出行情况为 表单回显的时候 并没有清空 而是重置为上一次的值
按照文档的说法
resetFields 对整个表单进行重置，将所有字段值重置为空并移除校验结果
但是实际上resetFields是清空validateMessage，然后将值重置为上一次初始化的值。
解决办法:
这个问题的本质是因为你编辑时，第一次打开对话框的时候给表单绑定的模型赋值了，
这时候这个模型的初始值就变成了你所赋值的值，所以resetFields的时候，替换模型对应的每个值重置到初始值，
这时候的初始值就是你编辑时赋值的那个值，而不是在数据里声明的初始值，解决方式是，等dialog已经初始化安装之后再给模型赋值，也就是
this.$nextTick(() => { // 这里开始赋值 this.formData = xxx; })
form表单里有upload组件时报错
浏览器报错
Uncaught TypeError: Cannot set property 'status' of undefined
at s.handleProgress (vendor.dll.js:44)
at Object.onProgress (vendor.dll.js:44)
at XMLHttpRequestUpload.t.upload.t.upload.onprogress
(vendor.dll.js:44)
原因很简单，由于这个表单是在一个弹框