Почему useEffect не срабатыает при перезагрузке страницы?

Question

[Кирилл]

Есть кастомный хук, который слушает ресайз и меняет стейт. Если ресайзить окно, то блоки меняются и все ок. Но если сначала изменить ширину экрана, а потом перезагрузить страницу, то функция не сработает и нужный блок не отрендерится, пока не произойдет ресайз.

Отсюда 2 вопроса:
1. Почему так происходит?
2. Как сделать так, чтобы при перезагрузке страницы определялась ширина экрана и устанавливалось соответсвующее состояние?

Спасибо.

https://codesandbox.io/s/reverent-gareth-wqn1z?fil...

Answer 1

[abberati]

У вас две ошибки
Первая — внутри эффекта вы добавляете обработчик и всё. Обработчик будет вызван и изменит значение только при ресайзе.
Вторая —нарушено правило useEffect про зависимости, isMobile замыкается.

Посмотрите на готовое решение, сравните со своим, почитайте статью про useEffect

Готовое решение
Статья

Comments

[Кирилл]

Спасибо за ответ! Готовое решение решило мою проблему, но я не понял вторую ошибку, вероятно из-за недостаточных знаний в js. Можете привести отрывок из моего кода, где isMobile замыкается?