上面的问题 销毁之后还能再打开吗
时间: 2024-03-17 16:43:49 浏览: 22
在销毁 elemenui dialog 实例之后,如果需要再次打开 dialog,需要重新创建 dialog 实例并将其挂载到页面上。
以下是一个示例代码,演示如何在销毁后再次打开 elemenui dialog:
```
<template>
<div>
<el-button @click="openDialog">打开 dialog</el-button>
</div>
</template>
<script>
import { Dialog } from 'element-ui';
export default {
data() {
return {
dialogVisible: false,
dialogInstance: null
}
},
methods: {
openDialog() {
// 如果当前已经存在 dialog 实例,则先销毁该实例
if (this.dialogInstance) {
this.dialogInstance.$destroy();
this.dialogInstance = null;
}
// 创建新的 dialog 实例并挂载到页面上
this.dialogInstance = new Dialog({
title: '标题',
message: '内容'
});
this.dialogInstance.$mount();
document.body.appendChild(this.dialogInstance.$el);
// 设置 dialog 的可见性为 true,即打开 dialog
this.dialogVisible = true;
}
}
}
</script>
```
在上面的示例中,我们在 openDialog 方法中创建了一个新的 dialog 实例,并将其挂载到页面上。在销毁之前,我们先判断是否已经存在 dialog 实例,如果存在则先销毁该实例。在打开 dialog 时,我们将 dialog 的可见性设置为 true。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)