如何阻止react-date-picker设置默认日期范围？如何获取明日日期对象？

如果使用的是react-datepicker库的单日期选择器，只需将受控状态的初始值设为null，并且不设置defaultValue属性，组件就不会自动选中默认日期：

import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import { useState } from "react";

function YourComponent() {
  const [selectedDate, setSelectedDate] = useState(null);

  return (
    <DatePicker
      selected={selectedDate}
      onChange={(date) => setSelectedDate(date)}
    />
  );
}

如果是日期范围选择器（DateRangePicker），则需要把startDate和endDate的初始值都设为null：

import { DateRangePicker } from "react-datepicker";
import { useState } from "react";

function YourRangeComponent() {
  const [dateRange, setDateRange] = useState({
    startDate: null,
    endDate: null
  });

  return (
    <DateRangePicker
      startDate={dateRange.startDate}
      endDate={dateRange.endDate}
      onChange={(update) => {
        setDateRange({
          startDate: update.startDate,
          endDate: update.endDate
        });
      }}
    />
  );
}

直接基于今日日期创建副本，调用setDate()方法将日期加1即可，Date对象会自动处理月末、年末的进位逻辑：

const today = new Date();
const tomorrow = new Date(today);
tomorrow.setDate(today.getDate() + 1);

这样得到的tomorrow和new Date()返回的格式完全一致，是标准的Date对象。

内容的提问来源于stack exchange，提问作者boredProjects