ApachaiReact
@ApachaiReact

Почему не работает removeEventListener в React?

Есть такой участок кода:
useEffect(() => {
    if (cookieInfo) {
      if (cookieInfo === "no") {
        setCookieBLock(true);
        window.addEventListener("mousewheel", disableOnwheel, {
          passive: false,
        });
        console.log(1);
      } else {
        console.log(2);
        window.removeEventListener("mousewheel", disableOnwheel, {
          passive: false,
        });
      }
    }
  }, [cookieInfo]);

  function disableOnwheel(e) {
    e.preventDefault();
    console.log(3);
  }

По логам вижу все выводится по порядку сначала 1, при скролле 3, а после нажатия кнопки отмены 2, т.е. в removeEventListener он заходит, но не срабатывает, скролл как перестал работать, так и не работает, в чем может быть проблема?
  • Вопрос задан
  • 241 просмотр
Решения вопроса 1
Итак, как раз для прокрутки addEventListener и removeEventListener использовать в реакте вполне легально.
Более того, вы вполне обошли использование рефов используя window, тут все хорошо.
Но вот на следующих граблях - жизненном цикле вы таки споткнулись.
Где гарантия, что компонент не перерендерился и функция disableOnwheel осталось той же что и была ?
Нужно
1) Вынести disableOnwheel за пределы компонентов, там нет ничего что зависело бы от наличия React
2) Внимательно прочесть про клинап https://reactjs.org/docs/hooks-effect.html
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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