解决el-dialog与el-tabs一起用卡死的问题
更新时间：2026年01月22日 16:38:14 作者：四木Zhang
在el-dialog中嵌入el-tabs和el-transfer时,关闭dialog会导致浏览器卡死,通过排查发现是destroy-on-close属性和el-tabs冲突导致的,解决方法是去掉destroy-on-close属性或给el-tabs添加v-if
问题描述
在el-dialog中嵌入了使用el-tabs和el-transfer，在浏览器点击el-diaolg后，能正常操作，关闭dialog时，浏览器直接卡死
- 先找自身代码原因，下意识以为是嵌入的el-tabs或者el-transfer写法有问题
- 然而发现不关闭时是能进行操作的，就挨个屏蔽el-tabs和el-transfer，发现屏蔽el-tabs后就没问题
- 本着面向百度、谷歌开发的原则，发现有好多人碰到一样的问题
- 猜测原因可能是el-dialog的
destroy-on-close属性和el-tabs会有冲突
解决方案
- 把el-dialog的
destroy-on-close属性去掉就好了 - 或者给el-tabs添加 v-if
至此，问题解决。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
Vue.js 的内联表达式非常方便，但它最合适的使用场景是简单的布尔操作或字符串拼接。如果涉及更复杂的逻辑，你应该使用计算属性。下面这篇文章主要给大家介绍了Vue.js中的计算属性,需要的朋友可以参考借鉴，一起来看看吧。2017-01-01
这篇文章主要为大家详细介绍了Vue参数的增删改实例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2022-03-03
这篇文章主要介绍了vue.js实现插入数值与表达式的方法,结合实例形式分析了vue.js常见的3种插入数值实现方式,并总结了vue.js插值与表达式相关使用技巧,需要的朋友可以参考下2018-07-07
这篇文章主要为大家详细介绍了Vuex实现购物车小功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-08-08
Vue中使用Echarts响应式布局flexible.js+rem适配方案详解
这篇文章主要介绍了Vue中使用Echarts响应式布局flexible.js+rem适配方案详解,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-01-01
这篇文章主要介绍了vue如何使用formData传递文件类型的数据问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-05-05
这篇文章主要介绍了Vue中子组件向父组件传值$emit、.sync的方法，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了Element input树型下拉框的实现代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-12-12
下面小编就为大家分享一篇完美解决axios在ie下的兼容性问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
在最近新起的项目中,用到了较新的技术栈vue3.2+vite+ts,跟着网上的写法渐渐上手了,下面这篇文章主要给大家介绍了关于vue3如何加载本地图片等静态资源的相关资料,需要的朋友可以参考下2023-04-04
最新评论