使用 React Datepicker 从给定日期排除未来日期

Question

将 React Datepicker 库与 Moment.js to manipulate dates, one can exclude given days as captured below and described in the React Datepicker documentation 一起使用时；

// Exclude today and yesterday.
excludeDates = {[moment(), moment().subtract(1, "days")]}

如何从给定日期中排除未来日期？

Answer 1

您可以使用 filterDate 检查和 return true 如果日期是过去的。

下面的代码片段说明了如何使用 filterDate;

<DatePicker
  selected = {this.state.date}
  onChange = {this.handleChange}
  filterDate = {(date) => {
    return moment() > date;
  }}
  placeholderText = "Select a weekday"
/>

Answer 2

您可以使用日期选择器的 minDate 和 maxDate 选项。

例如：如果您想排除所有 10 天后的日期，

<DatePicker
selected={new Date()}
onChange={this.handleChange}
maxDate={addDays(new Date(), 10)}
/>

如果要排除所有过去的日期和 10 天后的日期。

<DatePicker
selected={new Date()}
onChange={this.handleChange}
minDate={new Date()}
maxDate={addDays(new Date(), 10)}
/>

使用 React Datepicker 从给定日期排除未来日期

Exclude future dates from a given date using React Datepicker

reactjs

react-datepicker