element dialog 关闭时销毁组件

<el-dialog title="销毁组件" :visible.sync="compVisible"  @close="clearComp()" > 

            <自定义组件 v-if="showComp"></自定义组件>

 </el-dialog>

<script>

import 自定义组件 from .......;

export default {

        data() {

            return {

                compVisible:false,

                showComp:false

            };

},        

components: {

自定义组件

},

method: {

        clearComp(){

            this.showComp=false;

            this.compVisible=false;

            }

}

 

这样，在关闭dialog后，组件的内容就会被销毁，再次打开时会重新加载数据