Les Hooks sont une nouvelle addition à React 16.8 qui permettent d’utiliser l’état de React et d’autres fonctionnalités de React sans avoir à écrire une classe. Essentiellement, ils sont des fonctions qui se branchent dans l’état et le cycle de vie de React à partir de composants fonctionnels.
Les Hooks ne fonctionnent pas dans les classes. Ils vous permettent d’utiliser React sans classes.
Il y a plusieurs Hooks disponibles mais les deux plus communs sont useState et useEffect.
1. useState: Ceci est un hook que nous utilisons pour ajouter l’état de React dans notre composant fonctionnel. Par exemple :
```
import React, { useState } from ‘react’;
function Example() { // Déclare une nouvelle variable d’état, qu’on va appeler “count“ const [count, setCount] = useState(0);
return (Vous avez cliqué {count} fois
1. useEffect: Avec ce hook, vous dites à React de faire quelque chose après le rendu. React se rappellera la fonction que vous avez passé (nous l’appelons un “effet”), et la rappellera tardivement après avoir mis à jour le DOM. Par exemple :
```
import React, { useState, useEffect } from ‘react’;
function Example() { const [count, setCount] = useState(0);
// Effectue après chaque rendu useEffect(() => { // Met à jour le titre du document en utilisant l’API du navigateur document.title = `Vous avez cliqué ${count} fois`; }); return (Vous avez cliqué {count} fois
Ces deux Hooks couvrent la plupart des cas d’utilisation des classes dans React, mais il en existe d’autres comme : useContext, useReducer, useRef, etc.
