1. Управление состоянием
useState
использовать редьюсер
2. Устранение побочных эффектов
useEffect
useLayoutEffect
3. Используйте контекстный API
использоватьконтекст
4. Запомнить все
useMemo
useCallback
5. Используйте ссылки
useRef
useImperativeHandle
6. Повторное использование
Извлечение повторно используемого поведения в пользовательские хуки
1. Управление состоянием
Путь класса
Крючок
useReducer
Альтернатива useState. Используйте его в компонентах, которым требуется сложное управление состоянием, например, несколько значений состояния обновляются несколькими методами.
2. Справляйтесь с побочными эффектами
использовать эффект
Путь класса
Крючки
useLayoutEffect
Почти то же самое, что и useEffect, но срабатывает синхронно после фазы рендеринга. Используйте это для безопасного чтения или записи в DOM.
использованиеконтекста
Классный путь
Крюк путь
useMemo
использоватьОбратный звонок
5. Используйте ссылки
useRef
useRef можно просто использовать как обычную ссылку React:
Но это также позволяет вам просто удерживать изменяемое значение при любом рендеринге. Кроме того, изменение значения ref.current не приведет к рендерингу.
useImperativeHandle
Позволяет настроить открытый интерфейс компонента при использовании ссылки. Следующий компонент будет автоматически фокусировать ввод дочернего элемента при монтировании:
6. Повторное использование
Извлечение повторно используемого поведения в пользовательские хуки
