useRef

Definition

Hook qui retourne un objet mutable {current} persistant entre les rendus, sans declencher de re-rendu quand il change. Sert a referencer des elements DOM ou stocker des valeurs.

Analogie

Comme un tiroir secret dans un bureau : tu y ranges des choses sans que personne ne le remarque (pas de re-rendu).

Exemple de code

const inputRef = useRef(null);
const timerRef = useRef(null);

useEffect(() => {
  inputRef.current.focus();
  timerRef.current = setInterval(tick, 1000);
  return () => clearInterval(timerRef.current);
}, []);

Cas d'usage

Acceder au DOM (focus, scroll), stocker des IDs de timer, garder la valeur precedente d'un state.

Anti-pattern

Termes lies