如何在 React + Typescript 中将状态更新为之前的状态

Question

我想将状态设置为之前的值。我有一个复选框列表，并根据它进行选择并单击 "Apply" table 中的列得到 shown/hidden。我能够实现这个功能。但是在点击 "Cancel" 时，我无法将其设置为之前的状态。

代码沙箱：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。参见示例：

如何在 React + Typescript 中将状态更新为之前的状态

How to update the state to its previous state in React + Typescript

javascript

setstate

typescript

ecmascript-6

reactjs