React-antd 关于select选择框，date(range)Picker时间选择器，dropDown下拉菜单,Popconfirm气泡确认框等组件弹出框随页面滚动条滚动而滚动的解决方法

1.Select选择器、date(range)Picker日期选择框

<Select
    placeholder="请选择"
    allowClear
    getPopupContainer={(triggerNode: { parentNode: any; }) => triggerNode.parentNode}
    showSearch>
    {data.map((item: any) => {
            return (
                <Option
                    key={item.value}
                    value={item.value}
                >
                    {item.label}
                </Option>
            );
        })}
</Select>

直接添加 getPopupContainer={(triggerNode: { parentNode: any; }) => triggerNode.parentNode}即可

2.dropDown下拉菜单

直接添加getPopupContainer可能不会生效，需要相对父容器定位

<div
    style={{ justifyContent: "space-between", position:'relative' }}
  >
    <Dropdown
      overlay={menu}
      trigger={["click"]}
      getPopupContainer={(triggerNode: any) => triggerNode.parentNode}
    >
      <Button type="primary">
        下拉菜单
        <DownOutlined />
      </Button>
    </Dropdown>
  </div>

3.Popconfirm气泡确认框

直接添加getPopupContainer会导致确认框样式改变，所以需要调整css，我的项目里弹出框的宽度缩短了，修改如下

.popConfirm {
    .ant-popconfirm {
        width: max-content
    }
}

其他样式调整根据项目css调整就好了 还有其他方法可写在评论区，为了老板换车换房，尽自己的绵薄之力！！！