web-dev-qa-db-fra.com

React hooks useEffect uniquement lors de la mise à jour?

Si nous voulons restreindre useEffect à s'exécuter uniquement lorsque le composant est monté, nous pouvons ajouter le deuxième paramètre de useEffect avec [].

useEffect(() => {
  // ...
}, []);

Mais comment faire en sorte que useEffect ne s'exécute qu'au moment où le composant est mis à jour sauf le montage initial?

32
koo

Vous pouvez le contourner en définissant l'état sur une valeur initiale non booléenne (comme une valeur nulle):

  const [isCartOpen,setCartOpen] = useState(null);
  const [checkout,setCheckout] = useState({});

  useEffect(() => {

    // check to see if its the initial state
    if( isCartOpen === null ){

      // first load, set cart to real initial state, after load
      setCartOpen( false );
    }else if(isCartOpen === false){

      // normal on update callback logic
      setCartOpen( true );
    }
  }, [checkout]);
0
awongh