在React状态对象中更改布尔属性

Question

I'm trying to update a boolean attribute inside a state object, and I'm having some trouble. Here is what I'm attempting to do:

this.setState(
  prevState => ({
    selectedGrocery: {
      ...prevState.selectedGrocery,
      checked: !prevState.checked
    }
  }),
  () => {
    console.log(this.state.selectedGrocery);
  }
);

State selectedGrocery.checked is initialized as false , and when I call the above code, it changes to true , but the next time the code is called, it doesn't change back to false . Thanks in advance!

Answer 1

You need to use prevState.selectedGrocery.checked in order to use the correct property.

this.setState(
  prevState => ({
    selectedGrocery: {
      ...prevState.selectedGrocery,
      checked: !prevState.selectedGrocery.checked
    }
  }),
  () => {
    console.log(this.state.selectedGrocery);
  }
);