javascript - 如何在 React + Typescript 中将状态更新到之前的状态

Question

我想将状态设置为之前的值。我有一个复选框列表，根据它的选择并单击“应用”，表中的列将显示/隐藏。我能够实现这个功能。但点击“取消”后，我无法将其设置为之前的状态。

CodeSandbox:https://codesandbox.io/s/funny-browser-2z3s5

单击“取消”后，复选框应设置为之前的状态。

点击是通过 SelectComponent.tsx 中的函数处理的，目标是将 optionsArr 重置为其原始值:

cancelSelection = (event: any) => {
  this.setState({ showList: false });
  this.setState((prevState: any) => ({
    // Isn't working
    optionsArr: prevState.optionsArr
  }));
};

Answer 1

setState updater 获取的参数是应用更改时的状态。将状态设置为等于什么都不会改变。

您需要单独跟踪以前的状态。例如，作为状态中的单独项目、实例变量或 props。参见示例:

Reset initial state in React + ES6

Clearing state es6 React