关闭el-dialog，清空form内容，重置组件

在关闭dialog时，我们通常需要对其中的form表单进行清除，如果dialog内部存有组件，也需要对其重置清空

如下列代码中，dialog中有一个form表单，有一个自定义组件
一、通过@close绑定dialog关闭方法closeFun()
二、通过@open绑定dialog开启方法openFun()
三、给自定义组件绑定v-if 判定
由于v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建，可以通过该方式重置自定义组件

<el-dialog title="信息报送" :visible.sync="dialogFormVisible" @close="closeFun()"@open="openFun()">
    <el-form :model="form"  ref="form" rules :rules="rules">
        <el-form-item label="联系人姓名 :" prop="contact" :label-width="formLabelWidth">
            <el-input v-model="form.contact" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="上传附件 :" prop="fileGroupId"  :label-width="formLabelWidth">
            <x-file-upload v-if="fileComponet" @getinfo = "getFileInfo"></x-file-upload>
        </el-form-item>
    </el-form>
</el-dialog>

清空方法

closeFun:function () {
    //重置form表单
    this.$refs['form'].resetFields();
    //通过v-if重置自定义组件
    this.fileComponet=false;
},
openFun:function () {
    //通过v-if重置自定义组件
    this.fileComponet=true;
}