element ui弹窗组件,

　　本文主要介绍Element的实现来修改弹出组件的级别。通过实例代码详细介绍，具有一定的参考价值。感兴趣的朋友可以参考一下。

前情

　　Element，一套基于Vue 2.0面向开发者、设计师、产品经理的桌面组件库，已经在项目中使用，非常好看。

　　当使用元素组件时，一切都很顺利，但当使用子弹框架组件Popover时，发现它没有任何效果。

　　通过控制台查看元素后，发现Popover实际上是可以工作的，但是因为zIndex低于页面上的其他元素，所以被页面上的其他内容屏蔽了。

　　查询元素文件后发现，官方已经考虑到了等级问题，需要指定一个初始等级，后面的弹框组件的等级会累加1，以保证后面的组件触发的等级始终高于前面的组件。

　　Element初始化时重置层级

　　元素的使用方法有两种，不同的求解方法是不同的。

　　引入完整元素：

　　从“Vue”导入Vue；

　　从“element-ui”导入元素；

　　Vue.use(Element，{ size: small ，zIndex:3000 })；

　　按需引入元素：

　　从“Vue”导入Vue；

　　从“元素-用户界面”导入{ Button }；

　　vue . prototype . $ ELEMENT={ size: small ，zIndex:3000 }；

　　Vue.use(按钮)；

　　正式文档-全局配置项目：https://element.eleme.cn/#/zh-CN/component/quickstart

　　如果Element已经初始化且已使用过弹框类组件

　　在这种情况下，修改Vue.prototype.$ELEMENT没有任何效果，因为它已经被使用了。此时需要手动修改，后面弹窗的组件会在这个值的基础上累加，代码如下：

　　从“element-ui/lib/utils/popup/popup-manager”导入PopupManager

　　PopupManager.zIndex=30000

　　这就是本文关于元素修改弹出组件级别的实现。有关元素弹出级别的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。