Реакция. js: Как вызвать функцию только один раз, наблюдая положение прокрутки - PullRequest
Новая
       9

Реакция. js: Как вызвать функцию только один раз, наблюдая положение прокрутки

0 голосов
/ 27 апреля 2020

Я хотел бы добавить значение к окну Object (dataLayer менеджера тегов Google), когда определенный компонент отображается на экране. Затем необходимо обработать вызывающую функцию, чтобы она не была кратной.

Итак, я попытался написать код, как показано ниже ... 

import _ from 'lodash';

export const ContentsComponent = () => {
  const DEFAULT_SCROLL_POSITION = 0;

  const [isPushed, setIsPushed] = useState<boolean>(false);

  const setScroll = (event: Event) => {
    const newScroll = (event.target as Document).documentElement.scrollTop;
    if ((newScroll > 400) && !isPushed) {
      setIsPushed(true);
      justOneceFunction()
    }
  };

  useEffect(() => {
    window.addEventListener('scroll', _.debounce(setScroll, 1000));
    return () => window.removeEventListener('scroll', _.debounce(setScroll, 1000));
  });

  const justOneceFunction = () => {...}
}

Результат: состояние isPressed обновлено true только для мгновение, но в следующий раз обновляется до false, поэтому justOneceFunction() вызывается несколько раз.

1 Ответ

1 голос
/ 27 апреля 2020

попробуй: 


useEffect(() => {
    window.addEventListener('scroll', _.debounce(setScroll, 1000));
  },[]);
...