切换在反应日选择器中选择的星期

Question

我在选定的一周内使用了 React 日期选择器。 如果选择新的一周，我的状态会更新。 如果我点击星期，我想取消选择日历中的星期。

此外，我从服务器获取并发布日期，所以我想检查一下日期是否被选中。如果选择了日期，点击到星期必须删除选中。

我的代码

    state = {
    selectedDays: [],
  };

  handleWeekClick = (weekNumber, days, e) => {
    this.setState({
      selectedDays: days,
    });
  };

  render() {
    const { selectedDays } = this.state;

    return (
      <div className="SelectedWeekExample">
        <DayPicker
          selectedDays={selectedDays}
          showWeekNumbers
          showOutsideDays
          onDayMouseEnter={this.handleDayEnter}
          onDayMouseLeave={this.handleDayLeave}
          onWeekClick={this.handleWeekClick}
        />

在sandbox

Answer 1

尝试将handleWeekClick改成这样：

handleWeekClick = (weekNumber, days, e) => {
    console.log(days);
    if (this.state.selectedDays.length) {
      this.setState({
        selectedDays: []
      });
    } else {
      this.setState({
        selectedDays: days
      });
    }
  };