Vxe Table vxe-select的坑

895 阅读1分钟

在开发过程中,当我的vxe-table,是动态添加行的,可能是因为table不够高,导致里面的vxe-select下拉看不到下拉选项,我然后利用插槽用elementui的el-select是可以显示的,但是从美观和一些其他问题来说还是不如vxe-seclet.于是我就各种翻阅资料,但是没找到有用的

最后我在检查元素的时候,发现了vxe-seclet激活后是有元素变化的,但是在视图的最下面

元素.png

这里找到了vxe-table--ignore-clear vxe-select--panel is--transfer这个类名,然后我调整了其z-index属性,.vxe-select--panel.is--transfer { z-index: 9999!important; },发现终于显示了

最后要提醒的是,不要写在当前组件的scoped内,应该写在全局的css里

自己找了一天的坑,给自己记录一下,以防以后再次遇到这种情况,也希望能帮助到他人

后记

可能是因为我的表格是在el-drawer上的原因,所以需要设置,因为今天在设置vxe-table的title-prefix时候出现了同样的问题.必须设置.vxe-tooltip--wrapper { z-index: 9999!important; }

可能在elementui的反馈组件上都有这个问题,就是vxe-table的z-index没有elementui反馈组件的z-index高,希望可以帮到大家