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

文章目录

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

环境是:

vue :2.6.10
elementui:2.15.3

解决方式:

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

<el-tab-pane label="贷款合同" name="0">内容</el-tab-pane>
改为:
<el-tab-pane label="贷款合同" name="0"> </el-tab-pane>

将内容放在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>

至此,问题解决。

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

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

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

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值