событие при переходе по ссылке Reactjs. узнать координаты скрола

Question

Подскажите пожалуйста, как в Reactjs отловить момент клика по ссылке(компонент в роутинге, переход на другую страницу), чтобы по возвращению обратно оказаться в том же месте скрола, когда кликал по ссылке. Пытался как-то так сделать:

  const [scrolls, setScroll] = useState([0, 0]);
  useEffect(() => {
    let cords = ["scrollX", "scrollY"];
    window.addEventListener("unload", (e) => {
      let res = [];
      cords.forEach((cord) => {
        res.push(window[cord]);
      });
      setScroll(res);
    });
    window.scroll(scrolls[0], scrolls[1]);
  }, [scrolls]);

но событие unload отслеживает только перезагрузку страницы, при переходе по ссылке это событие не работает. Только нужно соответственно на сам элемент повесить, а не на window, как примере. а мой элемент вида <Link></Link> и лежит в компоненте ниже

Answer 1

Компонент может восстановить свое состояние проверив текущий path
И если он совпадает со своим стартовым, сделать определенные действия

  useEffect(() => {
    if(window.location.pathname === '/') { // Вернулись назад или стартуем
      if(!isKeyboardActive) {
        document.addEventListener('keydown', keyboardNavPanel, false)
        setState({ ...actualStateRef.current, isKeyboardActive: true })
      }
    }
  })

БЛОГ НА HUSL

событие при переходе по ссылке Reactjs. узнать координаты скрола

Ответы (1 шт):