elementui Cascader 和 Select 当页面滚动时,下拉框不一起跟着滚动的问题
时间: 2024-02-17 21:01:51 浏览: 273
当使用ElementUI的Cascader和Select组件时,如果页面滚动时下拉框没有跟着滚动,可以通过为它们的下拉框添加一个父元素,并将该父元素的高度设置为固定值,从而解决这个问题。
例如,在Cascader组件中,您可以将下拉框的父元素设置为一个div,并将其高度设置为固定的值,如下所示:
```html
<div style="height: 300px; overflow: auto;">
<el-cascader
:options="options"
v-model="selectedOptions"
></el-cascader>
</div>
```
在上面的示例中,我们将Cascader组件的下拉框放在了一个高度为300px的div中,并且将该div的`overflow`属性设置为`auto`,以便在下拉框中显示滚动条。这样,当页面滚动时,div会跟着滚动,从而使下拉框也会跟着滚动。
同样地,在Select组件中,您也可以使用类似的方法来解决这个问题。例如:
```html
<div style="height: 300px; overflow: auto;">
<el-select v-model="selectedOption" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</div>
```
在上面的示例中,我们将Select组件的下拉框放在了一个高度为300px的div中,并且将该div的`overflow`属性设置为`auto`,以便在下拉框中显示滚动条。这样,当页面滚动时,div会跟着滚动,从而使下拉框也会跟着滚动。
阅读全文
相关推荐


















