Puis-je définir l'état dans un hook useEffect

Question

Disons que j'ai un état qui dépend d'un autre état (par exemple, quand A change, je veux que B change).

Est-il approprié de créer un hook qui observe A et place B à l'intérieur du hook useEffect?

Les effets seront-ils en cascade de telle sorte que, lorsque je clique sur le bouton, le premier effet se déclenchera, provoquant la modification de b, provoquant le déclenchement du deuxième effet, avant le prochain rendu? Y a-t-il des inconvénients en termes de performances à structurer un code comme celui-ci?

 let MyComponent = props => {
  let [a, setA] = useState(1)
  let [b, setB] = useState(2)
  useEffect(
    () => {
      if (/*some stuff is true*/) {
        setB(3)
      }
    },
    [a],
  )
  useEffect(
    () => {
      // do some stuff
    },
    [b],
  )

  return (
    <button
      onClick={() => {
        setA(5)
      }}
    >
      click me
    </button>
  )
}

Answer 1

Les effets sont toujours exécutés une fois la phase de rendu terminée, même si vous définissezState dans un effet, un autre effet lira l'état mis à jour et n'agira dessus qu'après la phase de rendu.

Cela dit, il est probablement préférable de prendre les deux actions avec le même effet, sauf s'il existe une possibilité que b puisse changer pour des raisons autres que changing a auquel cas vous voudrez également exécuter la même logique