Question

我的状态如下：

this.state = {
  shoe: {
    selectedBrand: "",
    selectedEU: "",
    selectedUS: "",
    selectedUK: "",
    selectedFraction: "",
    thumbnail: null
  }
};

这绑定到几个Select组件，例如：

<Select value={this.state.shoe.selectedUK.value}
        onChange={this.updateSelectedValues.bind(this, "selectedUK")}
        options={uk}
/>

用户单击按钮后，我想重置状态，但是到目前为止，我还不能这样做。

这是我尝试过的：

创建了一个InitialState，但是由于原始状态已经发生了变异，我想这个初始状态也会发生变化，或者这是一个新实例吗？
尝试使用this.SetState({...})

有什么建议吗？

Answer 1

它应该通过执行this.setState({...})来工作，其中...要重置为的对象。

但是，如果定义一个对象然后重新使用它来重置所有内容，则可能会更容易。

constructor() {
  super();
  this.initialState = {
    shoe: {
      selectedBrand: "",
      selectedEU: "",
      selectedUS: "",
      selectedUK: "",
      selectedFraction: "",
      thumbnail: null
    }
  };
  this.state = {shoe: {...this.initialState}};
}

然后您可以使用类似的方法重置：

onReset() {
  this.setState(this.initialState);
}

绑定到React中的Select组件时重置状态

1 个答案: