mardi 20 juillet 2021

React setState doesn't work with if statement

I don't understand why below code doesn't change state. Even when 'if' statement is executed, state is the same. Why case with if doesn't change state?

this.setState((prevState) => {
  const copyItems = [...prevState.items];

  if (copyItems[index].done === false) {
    console.log("Done should be true");
    copyItems[index].done = true;
  } else {
    console.log("Done should be false");
    copyItems[index].done = false;
  }

  // copyItems[index].done = !copyItems[index].done - the same result

  return {
    items: [...copyItems],
  };
});

Below example works fine when there is no if statement:

this.setState((prevState) => {
  const copyItems = [...prevState.items];

  copyItems[index].done = true;
 
  return {
    items: [...copyItems],
  };
});

Below example works fine with 'if' statement in case when object is copied:

this.setState((prevState) => {
  const copyItems = JSON.parse(JSON.stringify([...prevState.items]));

  copyItems[index].done = !copyItems[index].done

  return {
    items: [...copyItems],
  };
});

Aucun commentaire:

Enregistrer un commentaire