为什么ReactJS更新状态为'；你没按预期工作吗？

我知道以前有人问过这个问题。但如果我遵循公认的答案，那对我来说就不起作用了。这是我的密码：-

  export class SurveyForm extends Component {
constructor(props) {
  super(props);
  this.state = {
    isSelected: false,
    selectedVal: 0,
    selectedRatingIndex: -1,
  };
  this.handleSubmit = this.handleSubmit.bind(this);
}

onClick={() => {
      // this is the recommended way of setting state. This doesn't work. 
      this.setState((prevState) => ({
        selectedRatingIndex: (prevState.selectedRatingIndex = val),
      }));

      this.setState((prevState) => ({
        isSelected: (prevState.isSelected = !this.state.isSelected),
      }));
// other code removed.  
}

但如果我这样做：-

     this.setState({
        selectedRatingIndex: (this.state.selectedRatingIndex = val),
      });
      this.setState({
        isSelected: (this.state.isSelected = !this.state.isSelected),
      });

---

它可以工作，并显示警告

不要直接改变状态。使用setState（）

我很困惑，在这种情况下应该怎么做？

当您使用对象调用

setState

时，该对象应该只包含新值

this.setState({
    selectedRatingIndex: val,
});
this.setState({
    isSelected: !this.state.isSelected, // it would be better to use a prevState callback instead of this.state
});

使用

prevState

回调时，返回一个从

prevState

派生的新值对象

this.setState((prevState) => ({
    selectedRatingIndex: val, // there is no point to a prevState callback here because prevState is unused
}));
this.setState(prevState => ({
    isSelected: !prevState.isSelected,
}));

---

当你这样做的时候：

this.setState({
    selectedRatingIndex: (this.state.selectedRatingIndex = val),
});

---

通过使用赋值运算符

=

设置

this.state.selectedRatingIndex=val

，可以改变状态。该赋值返回的值是新值（

val

），这就是它工作的原因：您实际上是在调用

this.setState（{selectedRatingIndex:val}）

，但是您在过程中改变了不应该做的状态。

当您使用对象调用

setState

时，该对象应该只包含新值

this.setState({
    selectedRatingIndex: val,
});
this.setState({
    isSelected: !this.state.isSelected, // it would be better to use a prevState callback instead of this.state
});

使用

prevState

回调时，返回一个从

prevState

派生的新值对象

this.setState((prevState) => ({
    selectedRatingIndex: val, // there is no point to a prevState callback here because prevState is unused
}));
this.setState(prevState => ({
    isSelected: !prevState.isSelected,
}));

---

当你这样做的时候：

this.setState({
    selectedRatingIndex: (this.state.selectedRatingIndex = val),
});

---

通过使用赋值运算符

=

设置

this.state.selectedRatingIndex=val

，可以改变状态。该赋值返回的值是新值（

val

），这就是它工作的原因：您实际上调用的是

this.setState（{selectedRatingIndex:val}）

，但您在这个过程中改变了不应该做的状态。

变量val来自哪里？变量val来自哪里？