原因有两点:
el-form 标签需要绑定 ref 和 :model 属性
el-form-item 标签要绑定 prop 属性
重置表单
添加一个是否加载的开关 v-if="dialogVisible" ,由 dialogVisible的值来 控制 组件el-dialog是否重新加载。
<el-dialog
v-if="dialogVisible"
v-model="dialogVisible"
:title="saveOrupdateTitle"
width="50%"
:close-on-click-modal="false"
@close="closeDialog('noteForm')"
>
工具类 resetForm.js
//重置表单和表单数据
export default function resetForm(fromName, obj) {
//清空表单
if (this.$refs[fromName]) {
this.$refs[fromName].resetFields()
}
//清空数据域
Object.keys(obj).forEach(key => {
obj[key] = ''
})
}
openDeptDialog() {
//清空表单数据
this.$resetForm("deptForm", this.dept);
//this.$refs[formName.toString()].resetFields()
this.deptDialog.title = '新增部门'
this.deptDialog.visible = true
}