问题截图如下
可以看到下拉框的数据明显要高于页面的高度,下拉框的部分数据被遮挡
首先想到的是设置select的下拉框的高度
1.设置select弹出下拉框的高端,然后添加自动滚动
dropdownStyle={{ maxHeight: 500, overflow: 'auto' }}
效果如下图
这样虽然看起来是成立,但是限制了大小,显示在不同大小的屏幕上会显得很难看。而且这个方法并没有彻底解决问题,当你的弹出层拉到页面最顶部距离小于设置的maxHeight高度还是会出现部分被遮挡。
2.然后看了一下官网发现了
自己尝试了一下在组件里面设置了下面的属性
getPopupContainer={triggerNode => triggerNode.parentNode}
发现是可以的,效果如下
基本解决问题