【element】 el-select 下拉框内容跟随页面滚

最新推荐文章于 2024-06-04 11:39:56 发布

原创最新推荐文章于 2024-06-04 11:39:56 发布 · 2.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #elementui

日常问题合集专栏收录该内容

9 篇文章

订阅专栏

博客主要围绕ElementUI下拉框报错展开。原因是ElementUI下拉框z-index权重最高，会出现脱离或超出弹框现象，调低权重又会使节点被弹出框覆盖。文中虽未详细说明解决办法，但聚焦于该问题的解决。

1. 报错如图

在这里插入图片描述

2.原因

elementui 下拉框的z-index权重最高,会出现脱离或者超出弹框的现象,调低权重会出现节点被弹出框覆盖的情况

3.解决

:popper-append-to-body="false"

 <el-option
     v-for="item in options"
     :key="item.cons_no"
     :label="item.cons_name"
     :value="item.cons_no"
  >
     <div class="tooltip-wrap" :title="item.cons_name">{{ item.cons_name }}</div>
  </el-option>
   .tooltip-wrap {
      width: 100%;
      /*文本不换行*/
      white-space: nowrap;
      overflow: hidden;
      /*文字超出用省略号*/
      text-overflow: ellipsis;
   }
   .el-popper {
      width: 174px !important;
   }