VEU开发之element-ui中关闭dialog时并销毁
2024-10-21 19:47:30
el-dialog正常使用过程中,经常会发现一些问题,就是dialog加载的组件,每次打开都会有上次的内容,其实是加载到节点未被删除,只是反复隐藏/显示。
<el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose">
<span>这是一段信息</span>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
<script>
export default {
data() {
return {
dialogVisible: false
};
},
methods: {
handleClose(done) {
this.$confirm('确认关闭?')
.then(_ => {
done();
})
.catch(_ => {});
}
}
};
</script>
如果想每次都调用el-dialog组件的挂载mounted,参看官网后发现给dialog加v-if,在关闭dialog的时候将v-if设置为false这样el-tree会直接将其从DOM结构中抹除,到此问题解决。
思考:事实这个个基础,vue中,只要是v-if为false都会被删除dom,true的时候会被重新添加。而visible和v-show基本是一样的效果。
最新文章
- Tomcat基于虚拟路径的发布和web.xml配置
- 更改eclipse的Package Explorer的字体
- mysql命令行以及mysql workbence查询结果中文乱码的解决方法
- 详解log4j2(上) - 从基础到实战
- Oracle11g中ORA-01790
- UVa 10747 - Maximum Subsequence
- hive 调用java的函数和科学记数法转换
- eclipse中logcat偶尔不显示log的问题解决办法
- 带缓冲I/O和不带缓冲I/O的区别与联系
- (转)function($){}(window.jQuery) 是什么意思?
- Ubuntu安装Mysql及使用
- RPC介绍以及编程
- [Swift]LeetCode799. 香槟塔 | Champagne Tower
- SpringBoot集成MongoDB
- stm8 iar开发
- Python:SQLMap源码精读—start函数
- indexOf() 使用方法(数组去重)
- TP5.1:request请求对象(使用四种方式获取)
- internal table operation
- charles系列破解激活办法(最高charles4.2.5都可以激活,亲测可用)