sottoReact хранит состояние хуков по порядку вызова в компоненте — поэтому хуки вызывают только на верхнем уровне, не в условиях и циклах.
| хук | для чего |
|---|---|
useState | состояние |
useEffect | синхронизация с внешним миром: подписки, таймеры, запросы |
useRef | изменяемое значение без перерисовки, ссылка на DOM |
useMemo, useCallback | запомнить вычисление или функцию между рендерами |
useContext | данные из контекста |
useReducer | сложное состояние с действиями |
useEffect(() => {
const id = setInterval(tick, 1000);
return () => clearInterval(id); // очистка
}, [tick]);Что важно знать
- Массив зависимостей должен содержать все используемые значения; пустой массив — эффект один раз после монтирования.
- Эффект — не место для вычисления данных из props: это делают при рендере.
- В режиме разработки StrictMode монтирует компонент дважды, чтобы поймать эффекты без очистки.
- Свои хуки (
useDebounce,useMediaQuery) выносят повторяющуюся логику.