el-dialog和el-form搭配使用时无法重置表单的问题

前言

模态框+表单的组合十分普遍,你有没有遇到this.$ref[formName].resetFields()无效的情况?

解决

在onReset()方法中做一点小手脚

onReset(formName){
  this.$nextTick(() => {
        this.formLabelAlign = formName;//formLabelAlign是我form表单绑定的对象
      });
   this.$refs[formName].resetFields();
  }

原理就是等模态框加载全部完成以后,执行一个反向绑定的操作,表单填写的内容赋值给绑定的对象,然后再执行一遍重置操作