Juniorrrrr
@Juniorrrrr

Как правильно использовать hook useEffect?

Доброго времени суток. Часто приходится писать хуки подобно этому
useEffect(() => {
      dispatch(
        someAction({ ...params, anotherParams, page}),
      )
  }, []);

И к примеру необходимо задиспатчить экшн лишь единожды при монтировании компонента и всё как бы работает, но линтер начинает ругаться мол вставь в зависимости params, anotherParams, page и dispatch и естественно если это сделать , то начинается боль.
На классах в этом плане было проще писать код.
5e453e12ede37539280143.png

Подскажите опытные люди, как вы решаете такие моменты ?
  • Вопрос задан
  • 198 просмотров
Решения вопроса 1
profesor08
@profesor08 Куратор тега JavaScript
Во первых, useEffect сработает всегда, при рендере компонента. Обновилс просы или стейт, и будь уверен, useEffect будет вызван. Это значит, что тебе надо ввести внутренний стейт для компонента, обозначающий, что он отобразился.
const Comp = () => {
  const [ready, setReady] = useState(false);
  const dispatch = useDispatch();

  useEffect(() => {
    if (ready === false) { // после отображения элемента будет вызвана функция, `ready` все еще будет `false`, поэтому выполнив свой код, надо вручную задать ей true, чтоб код не вызывался дважды.
      dispatch({ type: 'increment-counter' });
      setReady(true);
    }
  });
};


В ошибке тебя просят убрать `[]` из вызова useEffect

Как использовать хуки в redux написано тут, с примерами:
https://react-redux.js.org/next/api/hooks
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы