Highload — медіа для розробників
4.16K subscribers
5.6K photos
277 videos
18 files
6.49K links
Розповідаємо про людей, які створюють код, та про код, який вони пишуть.

Зв'язатися із редакцією можна тут: news@highload.today. А щодо розміщення реклами, будь ласка, пишіть на specials@highload.today.

Наш чат https://t.me/highloadchatt
Download Telegram
​​Обновление состояния компонента с помощью useState и useEffect

Сегодня разберем проблемы с обновлением состояния с помощью хуков на React. Иногда возникают сложности с пониманием как правильно обновлять состояние компонента с помощью хуков useState и useEffect. Если попробовать изменить состояния с помощью useState напрямую, никаких изменений не произойдет. Дело в том, что, подобно setState в классовых компонентах, обновление состояния с помощью useState также является асинхронным и не будет отражено немедленно.

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

Если вы хотите выполнить какие-либо действия для обновления состояния, вам нужно использовать хук useEffect, как и при использовании componentDidUpdate. Важно помнить, что внутри хука useEffect, состояние все еще не поменяется, а при вызове вернет прежнее значение.

Полный тред со всеми возможными решениями можно найти по ссылке: https://stackoverflow.com/questions/54069253/usestate-set-method-not-reflecting-change-immediately

#javascript #reactjs #usestate #useeffect