React Date Picker隐藏在溢出父级之后(弹出固定位置问题)

import React from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';

const DatePickerExample = () => {
  return (
    <div style={{ position: 'relative' }}>
      <DatePicker
        selected={new Date()}
        onChange={(date) => console.log(date)}
        popperPlacement="bottom-start"
        popperModifiers={{
          offset: {
            enabled: true,
            offset: '0, 10px' // 调整弹出框的位置
          },
          preventOverflow: {
            enabled: true,
            escapeWithReference: false, // 不允许弹出框溢出父级容器
            boundariesElement: 'viewport' // 弹出框不会溢出浏览器窗口
          }
        }}
      />
    </div>
  );
};

export default DatePickerExample;