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

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}
        />

在沙盒中

标签： reactjs

Answer 1

尝试更改handleWeekClick为：

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