vue + ElementUI 关闭/取消对话框时清除form表单

要求：在点击x和点击取消时，清空form表单

1、点击x时，清空form表单

解决方法：需要用到dialog组件的before-close属性

 

 //关闭dialog前
    closeExpertFormDialog(done){
      this.$refs["addExpert"].resetFields();
      done();//done 用于关闭 Dialog
    },

注意： this.$refs["addExpert"].resetFields();中的addExpert是表单的ref

 

2、点击取消时，清空form表单

解决方法：在dialog框中的取消按钮中加个click事件

//html
 

            取 消
            保存
 

其中，cancelExpert('addExpert')的addExpert是表单名

//js
//取消dialog
    cancelExpert(formName){
      this.$refs[formName].resetFields();
      this.addExpertInfo = false; //关闭对话框
    },

记录于此！！！