Вопрос по теории useEffect?

Question

[Denis1205]

Обьясните пожалуйста такой момент, я читаю про хук useEffect и не могу понять такой момент.
Первый вызов useEffect() будет сразу после того, как ваш компонент будет вмонтирован в DOM
Почему тогда в useEffect рекомендуется использовать fetch запросы с данными?
Если я правильно понимаю - то компонент вмонтировался в DOM, потом в useEffect прошел fetch, к примеру вернулся список товаров, и только потом происходит перерендер DOM с нашим список пользователей. Я всё правильно понимаю? Если да то почему тогда в реакте сразу не происходит fetch с ожиданием ответа, а потом уже рендер и монтирование в DOM?

Comments

[WbICHA]

То есть ты предлагаешь показывать юзеру пустую белую страницу, пока идёт фетч запрос? В этом как бы и суть, чтобы показывать лоадер/скелетоны пока данные подгружаются.

Answer 1

[Роман Дворянов]

Суть в том, что useEffect можно использовать по разному, если не передавать зависимости, то useEffect сработает до и будет работать на каждый рендер, даже можно использовать несколько useEffect в разных целях.

useEffect(() => {
  // какой-то код
}); // без указания второго аргумента работает на каждый "чих"

useEffect(() => {
 // с пустым массивом зависимостей сработает аналогично componentDidMount, тут лучше фетчить
}, []);

useEffect(() => {
  console.log(props)
  // с зависимостями аналогично componentDidUpdate
}, [props])

useEffect(() => {
  // можно вернуть функцию, это будет аналогично componentWillUnmount
  return () => {
     // тут можно удалять всякие листнеры и слать события в стор, этот код сработает при размонтировании
  }
}, []);

P.S: удачи в собесах))

Comments

[Denis1205]

спасибо))