Element-ui中弹层close事件重置表单数据

目标：在弹层隐藏时（点了表单上的：取消，确定，点了弹层中右上角的关闭，点了ESC，点了弹层的遮罩区域），将表单数据恢复到之前的状态

 两种方法：

1. v-if 

<el-dialog :visiable="showDialog" v-if="showDialog"></el-dialog>

当弹层隐藏时，组件会被v-if销毁，从而清空表单数据
注意：v-if的方法虽然非常简单，但组件的销毁和重建会消耗性能

2.用<el-dialog>组件的close事件

在关闭弹层时，showDialog的值会变成false，它会触发弹层（el-dialog组件）的close事件

<el-dialog  :visible.sync="showDialog" title="弹层标题"  @close="close">

在方法中清空表单：

 close () {
      // 1. 把表单的数据项清空
      this.directoryAdd = {
        subjectID: '',
        directoryName: ''
      }
      // 2.清空校验
      this.$refs.form.resetFields()
    }