如何修复Vue中Iview Modal嵌套Modal显示格式错乱的问题？

本文共计737个文字，预计阅读时间需要3分钟。

目录 + 使用iview的Modal弹窗嵌套Modal出现格式错误 + 问题 + 解决 + iview + View + UI + vue + modal + 报错 + TypeError: t is undefined + 概述 + Bug图 + 原因分析及解决方案 + 其他扩展 + 使用iview的Modal弹窗嵌套Modal出现格式错误

目录

• 使用iview的modal弹窗嵌套modal出现格式错误
• 问题
• 解决
• iview View UI vue modal 报错 TypeError:t is undefined
• 概述
• bug图
• 原因分析及解决办法
• 其他延展

使用iview的modal弹窗嵌套modal出现格式错误

问题

一个全屏modal，点击按钮，再弹出一个modal，就会出现这种格式问题，很无语。

解决

搜了一下，说是因为modal的使用是平级的，z-index都是1000，所以后面的会覆盖前面的。

不知道是不是因为这个，因为我把嵌套的这个modal改成全屏的，就没有问题了。

解决办法是说给modal加一个类名， z-index改一下就行了，除了要改嵌套modal（以下简称modal2）的z-index，modal2的mask（阴影）也需要改。