setstate React 后状态不更新

Question

我无法更新 React Big Scheduler 中的状态，用于添加、编辑和删除操作。

但是，对于更新活动的开始和结束，它可以工作。

这是代码：

 let schedulerData = new SchedulerData(
      new Date(),
      ViewTypes.Month,
      false,
      false,
      { checkConflict: false }
    );
    schedulerData.setResources(this.props.resources)
    schedulerData.setEvents(this.props.events)
    this.state = {
      viewModel:  schedulerData,
      event: undefined,
      editEvent: undefined,
      legend: false,
      types: undefined,
      slot: undefined,
    };
render() {
    this.state.viewModel.setResources(this.props.resources); //DemoData.resources
    this.state.viewModel.setEvents(this.props.events); //DemoData.events
    return (
      <div>
        {this.state.event || this.state.editEvent ? (
          <CustomModal
            resources={this.props.resources}
            reset={() => this.reset()}
            resetEdit={() => this.resetEdit()}
            event={this.state.event}
            editEvent={this.state.editEvent}
            sendData={(e) => this.sendData(e)}
            updateData={(e) => this.updateData(e)}
            types={this.state.types}
          />
        ) : null}
        {this.state.legend ? <Legend /> : null}
        {this.state.slot ? (
          <DetailModal
            level={this.props.role}
            resetSlot={() => this.resetSlot()}
            id={this.state.slot}
          />
        ) : null}
        <Scheduler
          schedulerData={this.state.viewModel}
          prevClick={this.prevClick}
          nextClick={this.nextClick}
          onSelectDate={this.onSelectDate}
          onViewChange={this.onViewChange}
          eventItemClick={this.eventClicked}
          viewEventClick={this.edit}
          viewEventText="Edit"
          viewEvent2Text={this.props.role === "L3" ? "Delete" : null}
          viewEvent2Click={this.props.role === "L3" ? this.delete : null}
          updateEventStart={this.updateEventStart}
          updateEventEnd={this.updateEventEnd}
          moveEvent={this.props.role === "L3" ? this.moveEvent : null}
          newEvent={this.newEvent}
          rightCustomHeader={this.rightCustomHeader}
          conflictOccurred={this.conflictOccurred}
          slotClickedFunc={this.slotClickedFunc}
        />
      </div>
    );
  }
  slotClickedFunc = (schedulerData, slot) => {
    this.setState({ slot: slot.slotId });
  };

  edit = (schedulerData, event) => {
    if (this.props.role === "L3") {
      let editEvent = {
        id: event.id,
        schedulerData: schedulerData,
        ...
        status: event.status,
      };
      this.setState({ 
    } else {
      return;
    }
  };
 

  newEvent = (schedulerData, slotId, slotName, start, end, type, item) => {

    let newEvent = {
      schedulerData: schedulerData,
      id: 0,
      ...
    };
    let newFreshId = 0;
    schedulerData.events.forEach((item) => {
            newFreshId = item.id + 1;
    });

    this.setState({ event: newEvent });
    schedulerData.addEvent(newEvent);
    this.setState({
        viewModel: schedulerData
    })
  };

 updateEventEnd = (schedulerData, event, newEnd) => {
    let newEventEnd = {
      id: event.id,
      ...
    };

    Axios.post(`${baseURL}/schedule/update/${event.resourceId}`, newEventEnd);
    schedulerData.updateEventEnd(event, newEnd);
    this.setState({
      viewModel: schedulerData,
    });
  };

我已尝试记录更新前后的状态，但未反映更改。如果我检查对象“schedulerData”，则会反映更改。

我知道反应状态有时会落后一步，但我不知道我的问题到底是什么。

我做错了什么？

Answer 1

你正在改变你的状态而不是创建一个新对象：

schedulerData.events.forEach((item) => {
            newFreshId = item.id + 1;
    });

更多信息请参见this