Крюки полагаются на порядок вызова, чтобы иметь смысл.
https://reactjs.org/docs/hooks-faq.html
Существует внутренний список «ячеек памяти», связанных с каждым компонентом.Это просто объекты JavaScript, куда мы можем поместить некоторые данные.Когда вы вызываете Hook, например, useState (), он читает текущую ячейку (или инициализирует ее во время первого рендеринга), а затем перемещает указатель на следующий.Вот как каждый из нескольких вызовов useState () получает независимое локальное состояние.
От https://github.com/gaearon/react-hot-loader
Поддержка хуков
Крючки будут автоматически обновляться в HMR, если они должны быть.Для этого есть только одно условие - ненулевой список зависимостей.
❄️ useState(initialState); // will never updated (preserve state)
❄️ useEffect(effect); // no need to update, updated on every render
❄️ useEffect(effect, []); // "on mount" hook. "Not changing the past"
? useEffect(effect, [anyDep]); // would be updated
? useEffect(effect, ["hot"]); // the simplest way to make hook reloadable
Чтобы отключить перезагрузку хуков - установить опцию конфигурации:
import { setConfig } from 'react-hot-loader';
setConfig({
reloadHooks: false,
});