vue+elementui 对话框取消 表单验证重置

最近在写增删改查，在新增的时候要弹出对话框填写form表单信息，发现对话框右上角的小X和右下角的取消不是一个事件，我想在点击它们两个的时候都可以重置表单，最终解决，如下。

vue：

    
        ...
    
    

        取消
        保存
    

js：

export default{
    data() {
        form: {
        }
    },
    methods:{
        // 对话框取消事件
        closeFrom(formName){
            this.dialogFormVisible = false;
            // 点击取消 数据重置
            this.$refs[formName].resetFields();
        },
        // 对话框关闭事件
        closeDialog(){
            // 点击关闭 数据重置
            this.$refs['form'].resetFields();
        }
    }
}