【vue+element ui】大屏自适应中el-select下拉内容在低分辨率下显示不全问题解决

目录

背景

现象

解决方案

---

背景

最近要把一个1920px*1080px的大屏改成自适应的；最低适配到1028px*720px；

现象

自适应适配改完之后

将电脑屏幕改成1028px*720px分辨率后，下拉显示正常

通过谷歌浏览器设置Toggle device toolbar为1028px*720px分辨率，下拉显示异常

其他页面的下拉框都受到影响

解决方案

使用F12对比查看，发现el-select中的el-select-dropdown__item是固定的；

解决办法：将el-select-dropdown__wrap改大，让内容全部显示出来；

全局设置，代码如下（项目中使用到的是scss）

/deep/.el-select-dropdown__wrap {
  max-height: 100% !important;
}

页面下拉可以全部显示，如下