Design Pattern React : Custom Hooks

Rien de compliqué ici, Le custom Hook commence toujours par 'use', son état est indépendant et permet de partager une logique entre chaque components.

Implémentation:

Step 1: Déclaration du use custom

const useAdd = () => {

  const [count, setCount] = useState(0);

  const add = () => setCount(count + 1);

  return [count, add];
};

Le nom de la fonction doit commencer par 'use' et ensuite on fait ce qu'on veut, on peut utiliser les hooks de react return les valeurs qu'on veut, ect....

Step 2: Utilisation

const [count1, add1] = useAdd();
const [count2, add2] = useAdd();

Le point important à retenir, c'est que chaque instance du hook custom est indépendante.