element-ui解决el-popover的边界重新计算元素位置的问题

Posted 2023-04-16

参考技术A 在项目中会遇到使用el-popover但是却不想要原生的边界重新计算元素的位置，比如：

当浏览器滚轮向下

如果我不想要有自动重新计算元素的位置，怎么办呢？

1、解决问题的第一步当然是去element上去看官方文档了

浏览popover组件的Attributes后我发现了这个popper-options属性

进到popper.js里面，用chrome翻译一下

找到了可以控制改组件行为的属性 boundariesElement，默认‘viewport‘是可视部分为边界，我这里改为‘body’

这样这个问题就解决了

2、如果官方文档还是不能帮助你解决问题

百度和github可以帮到你，翻墙的同学可以去stackoverflow逛逛

element ui el-popover 样式修改不生效解决方法

参考技术A 在使用element 的el-popover 组件时，会发现自己对el-popover 写的样式不起作用，甚至连使用
::v-deep
‘>>>’
/deep/
行内Style
这四种样式穿透都不起作用， 这是因为 el-popover生成的div不在当前组件之内，甚至不在App.vue组件的div内，他和App.vue组件的div平级。所以需要全局设置style

然后在当前文件样式中 不加scoped写一份