elemen中el-popper组件加上滚动条,小三角定位错乱了,有什么方法解决?

作者站长头像
站长
· 阅读数 14

elemen中el-popper组件加上滚动条,小三角定位错乱了,有什么方法解决?

.el-popper{
  max-width: 628px;
  max-height: 120px;
  line-height: 20px;
  padding-bottom: 0;
  color: #000000;
  overflow: auto;
}
.pop
回复
1个回答
avatar
test
2024-07-16

希望能帮到你:

页面:

<el-popover
  placement="top-start"
  title="标题"
  width="200"
  trigger="hover"
  popper-class="popperStyle"
>
  <div class="content">
    测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试
  </div>
  <el-button slot="reference">hover 激活</el-button>
</el-popover>


样式:

<style lang="scss" >
  .popperStyle {
    .content {
      height: 100px;
      line-height: 23px;
      padding-bottom: 0;
      color: #000000;
      overflow-y: auto;
    }
  }
</style>

问题

因为el弹出系列都是跟id="app"同级,所以scoped不能带,这样也会全局污染其他页面。你看div中起一个特别类名以便区分,避免污染全局el-popover。

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容