获取react日历的开始和结束日期

npm install react-date-range

import React, { useState } from 'react';
import { DateRangePicker } from 'react-date-range';
import 'react-date-range/dist/styles.css'; // 日期范围选择器的样式
import 'react-date-range/dist/theme/default.css'; // 日期范围选择器的主题样式

const Calendar = () => {
  const [dateRange, setDateRange] = useState({
    startDate: new Date(),
    endDate: new Date(),
    key: 'selection',
  });

  const handleSelect = (ranges) => {
    setDateRange(ranges.selection);
  };

  return (
    <div>
      <DateRangePicker
        ranges={[dateRange]}
        onChange={handleSelect}
      />
      <p>开始日期: {dateRange.startDate.toDateString()}</p>
      <p>结束日期: {dateRange.endDate.toDateString()}</p>
    </div>
  );
};

export default Calendar;