表单重置(避免数据残留)

当验证不通过时，表单上会出现错误报错，此时，我们直接隐藏这个对话框，然后再次打开时， 表单上的错误信息还是存在的。

对话框隐藏包括（点了表单上的：取消，确定，点了弹层中右上角的关闭，点了ESC，点了罩区域）如果再点击添加 那么之前输入的数据会残留在新的表单中 

我们需要的效果是第二次打开时是一个重新的表单 不是旧的错误表单

第一种方法: 就是在表单子组件中设置 v-if ()

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

第二种方法: 由于每一次打开弹框组件 , 那么弹框在这之前一定会触发  close 事件 因为弹框是在父组件中,而表单是在子组件中 ,所以我们需要现在子组件中给表单封装一个方法来重置表单,然后通过父组件中 ref 获取DOM元素的方法来操作子组件(表单组件) 并且调用子组件中的重置表单的方法

 第一步: 在表单组件中封装重置表单的方法

第二部: 在父组件中给弹框组件绑定 close(关闭的回调事件)

 第三步,在父组件中弹框关闭的回调事件中通过ref来操作表单组件的重置表单的方法