Остановите setInterval (), когда Компонент размонтируется? (Реагирует)

#javascript #reactjs #intervals

Вопрос:

Я хочу остановить функцию интервала, когда пользователь на моем веб-сайте меняет страницу. Я искал в Интернете «как определить, виден ли элемент реакции на экране», но я могу найти результаты только для наблюдателей пересечения. Есть ли способ остановить интервальную функцию, когда компонент react отключается? (пс. Я полагаю, что демонтаж происходит, когда компонент больше не отображается?)

Вот мой интервал компонентов:

 useEffect(() => {
   const updatePostInfo =
     inView amp;amp;
      setInterval(() => {
        dispatch(getPostInfo(data._id));
  }, 3500);
!inView amp;amp; clearInterval(updatePostInfo);
}, [inView]);
 

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

Ответ №1:

Вам нужно вернуть функцию очистки из вашего эффекта:

 useEffect(() => {
  const updatePostInfo = setInterval(() => {
    dispatch(getPostInfo(data._id));
  }, 3500);
  return () => clearInterval(updatePostInfo);
}, []);
 

Ответ №2:

Неважно, что я понял это, лол, я только что узнал, что return () => функция a useEffect() -это в основном componentWillUnmount часть.

Источник: учебное пособие

   useEffect(() => {
    const updatePostInfo =
      inView amp;amp;
      setInterval(() => {
        dispatch(getPostInfo(data._id));
      }, 3500);
    !inView amp;amp; clearInterval(updatePostInfo);
    return () => {
      clearInterval(updatePostInfo);
    };
  }, [inView]);