element-ui - elementui组件`el-popover`如何自定义设置`z-index`属性？
页面上有很多动态生成的el-popover，有可能堆叠，所以我希望能够手动控制z-index属性，例如，如果鼠标移动上去，我将某个el-popover的z-index加1，如此来控制弹框显示，改怎么设置呢 ？
共有1个答案
看了文档你可以这样操作：
popper-class 为 popper 添加类名 string — —
popper-style 为 popper 自定义样式
<template> <div> <div v-for="(item, index) in items" :key="index" @mouseover="handleMouseover(index)"> <el-popover placement="top" width="200" trigger="hover" :popper-class="`popover-${index}`" :popper-style="{ zIndex: zIndexes[index] }" > <p>内容</p> <button slot="reference">hover 激活</button> </el-popover> </div> </div></template><script>export default { data() { return { items: Array(10).fill(0), // 假设有10个popover zIndexes: Array(10).fill(2000), // 初始的z-index }; }, methods: { handleMouseover(index) { this.zIndexes = this.zIndexes.map((zIndex, i) => i === index ? zIndex + 1 : zIndex); }, },};</script>-
项目中使用到ele组件el-popover，页面上有不同类型的提示框，有些鼠标移上去显示，有些需要进入页面后就一直显示，且不会关闭。 鼠标移上去显示好实现：直接trigger='hover'救可以了，但是进入页面就一直显示的我使用方式 这么做确实能进入页面后一直显示，但是样式却不正常（和通过hover展示出来的样式），没有箭头，且紧紧挨着'reference'对象。 正常通过hover触发如下：
-
组件el-popover默认情况下会挂载到body下面，但是现在需要挂载到指定id的dom下，该如何操作？（挂到父节点下不行，因为父节点比较小，导致popover全部显示在右侧——设置placement无效）。 现在需要挂在到id='nodes-wrapper'的div下，该如何写？
-
项目中用到ele的table组件，某些列需要使用show-overflow-tooltip来提示，超出显示省略号，如果正常使用是没有问题的，但是由于列内容比较复杂，所以需要在列里面通过div来包裹内容，虽然能够提示tooltip，但是却无法显示省略号了，请问该怎么处理呢？谢谢！
-
element-ui组件el-popover嵌套使用的问题，在使用el-popover显示内容时，内容里面还需要使用到el-popover，都是hover触发方式，当鼠标移动到里面的el-popover时，外面的el-popover就自动关闭了，请问如何处理这个问题？
-
项目中需要用到el-tree做拖拽功能，但是层级有限制要求，例如：不能超过6级，但是allow-drop提供的方法参数感觉有问题，参照的层级对不上，导致计算有问题。
-
本文向大家介绍z-index如何定位？相关面试题，主要包含被问及z-index如何定位？时的应答技巧和注意事项，需要的朋友参考一下 参考回答： z-index属性设置元素的堆叠顺序，拥有更好堆叠顺序的元素会处于较低顺序元素之前，z-index可以为负，且z-index只能在定位元素上奏效，该属性设置一个定位元素沿z轴的位置，如果为正数，离用户越近，为负数，离用户越远，它的属性值有auto，默认，堆