Closed
Description
- antd 版本:1.9.1
- 操作系统及其版本:所有操作系统
- 浏览器及其版本:所有浏览器
问题描述
select、TimePicker等组件,当放置到某节点,并且这个节点有滚动条时,当这个节点滚动时,弹出的option层、日历选择层等停留在原有位置,不跟随滚动。这个问题还是挺常见的,比如将这类控件放到Modal里、放到Table里等(放入的这些控件自己设置了overflow:auto)。
问题原因
弹出的层放到了和初始展示节点不同的节点中,导致了弹出层是相对于body进行绝对定位,而当初始展示节点在一个带滚动条的节点时,这个节点在滚动时,body并没有变化,就造成了弹出层不随浏览器滚动的问题。这个应该是rc-select等底层组件的bug。
示例
打开 TimePicker官方API在控制台将.code-box
的样式增加
height: 100px;
overflow: auto;
在任意一个例子中点击组件弹出日历弹出层,然后滚动那个节点的滚动条
建议解决方式
将弹出的层放到了和初始展示节点放到同一个父节点中,弹出层相对于这个父节点进行绝对定位。