在Ant Design的TimePicker组件中,可以通过设置组件的属性getPopupContainer
来解决TimePicker随着页面滚动的问题。getPopupContainer
属性可以指定一个容器元素,让TimePicker的弹出层固定在这个容器中,不随页面滚动。
下面是一个示例代码:
import React from 'react';
import { TimePicker } from 'antd';
const App = () => {
const getPopupContainer = (triggerNode) => {
return triggerNode.parentNode;
};
return (
Scrollable Page
Scrollable Content
);
};
export default App;
在上面的代码中,我们将一个TimePicker
组件放置在一个高度为500px的滚动容器内。通过设置getPopupContainer
属性,将TimePicker
组件的弹出层固定在父元素中,即滚动容器内,不随页面滚动。
注意:如果你的项目中使用的是旧版本的antd,getPopupContainer
属性的名称可能是getCalendarContainer
,请根据具体的版本进行调整。
希望可以帮助到你!