javascript - 从日历中选择单个日期的 react-dates 解决方案

Question

我正在尝试使用 React-dates 在单击特定日期时突出显示所选日期，但没有得到任何解决方案。我曾经使用过：

isDayHighlighted={day1 => returnDates().some(day2 => isSameDay(day1, day2))}

可以正确突出显示日期。但是对于特定日期，我该怎么做。

Answer 1

如果我理解正确（根据您的评论），您希望在当前显示的月份发生更改时重置所选日期。

您可以连接到onNextMonthClick并将onPrevMonthClick日期设置为null。

运行示例

class App extends React.Component {
  state = { date: null, focused: false };

  onDateChange = date => {
    this.setState({ date });
  };

  onFocusChange = ({ focused }) => {
    this.setState({ focused });
  };

  resetDate = () => {
    this.setState({ date: null });
  };

  render() {
    const { focused, date } = this.state;
    return (
      <div>
        <h1>React Dates Test</h1>
        <SingleDatePicker
          date={date}
          focused={focused}
          numberOfMonths={1}
          onDateChange={this.onDateChange}
          onFocusChange={this.onFocusChange}
          onNextMonthClick={this.resetDate}
          onPrevMonthClick={this.resetDate}
        />
      </div>
    );
  }
}