el-dropdown设置高度 且可上下滑动但看所有行
时间: 2023-09-11 22:08:41 浏览: 175
vue+element搭建后台小总结 el-dropdown下拉功能
您可以在 el-dropdown 中使用 el-scrollbar 组件,将其包裹在一个具有固定高度的容器中。这样,当下拉菜单的高度超过容器高度时,就会出现滚动条,您可以通过滚动条滚动查看所有行。下面是一个示例代码:
```html
<el-dropdown>
<span class="el-dropdown-link">下拉菜单</span>
<el-dropdown-menu slot="dropdown">
<div class="scroll-container" style="height: 200px;">
<el-scrollbar>
<el-dropdown-item v-for="item in items" :key="item.id">{{ item.name }}</el-dropdown-item>
</el-scrollbar>
</div>
</el-dropdown-menu>
</el-dropdown>
```
其中,`.scroll-container` 是一个具有固定高度的容器,您可以根据需要设置其高度。`.el-scrollbar` 是 el-scrollbar 组件,用于提供滚动条功能。`.el-dropdown-item` 是 el-dropdown-item 组件,用于显示下拉菜单中的每一项。`items` 是一个数组,包含需要显示的所有项的数据。
阅读全文