elementui的el-dialog组件与el-tabs同时用导致浏览器卡死的原因解决

在el-dialog弹出框中，如果使用el-tabs，点击弹框的关闭按钮时，会导致弹出框无法关闭，且浏览器卡死。

环境是：

vue :2.6.10
elementui:2.15.3
1
2

解决方式：

在el-talbs的面板中不放任何内容：

<el-tab-pane label="贷款合同" name="0">内容el-tab-pane>
改为：
<el-tab-pane label="贷款合同" name="0"> el-tab-pane>
1
2
3

将内容放在el-tabs外面，然后用v-show来控制对应的内容的显示。如下图：

<el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="贷款合同" name="0"> el-tab-pane>
    <el-tab-pane label="放款凭证" name="1"> el-tab-pane>
    <el-tab-pane label="采购订单" name="2" :disabled="true">
    el-tab-pane>
    <el-tab-pane label="订单发票" name="3" :disabled="true">
    el-tab-pane>
el-tabs>
<div v-show="activeName == 0">
    面板1的内容
div>
<div v-show="activeName == 1">
    面板2的内容
div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

至此，问题解决。

最开始以为是el-form不能嵌套el-tabs，其实不是。

如果你在web前端开发、面试、前端学习路线有困难可以加我V：imqdcnn。免费答疑，行业深潜多年的技术牛人帮你解决bug。

祝你能成为一名优秀的WEB前端开发工程师！