Восстановление прокрутки на месте.изменить имя пути?

#reactjs #react-router #react-router-dom

Вопрос:

Страница должна прокручиваться вверх только в том случае, если она расположена.путь изменен, React.memo должен возвращать значение true только в том случае, если путь изменен, а не параметры запроса. Но страница прокручивается вверх, даже если обновление возвращает значение false.

 const shouldUpdate = (prevProps, nextProps) => {
  return prevProps.location.pathname !== nextProps.location.pathname;
};

const ScrollToTop = ({ history }) => {
  useLayoutEffect(() => {
    const unlisten = history.listen(() => {
      window.scrollTo(0, 0);
    });
    return () => {
      unlisten();
    };
  }, []);
  return (null);
};

export default withRouter(React.memo(ScrollToTop, shouldUpdate));

<React.Fragment>
    <Router>
      <ScrollToTop />
      <Switch>
        .
        .
        .
      </Switch>
    </Router>
  </React.Fragment>
 

Комментарии:

1. Поможет ли это? reactrouter.com/web/guides/scroll-restoration

2. Это самое первое решение, которое я попробовал.

Ответ №1:

Вы должны вызвать scrollTo метод с помощью useEffect крючка

   useEffect(() => {
    document.querySelector("#root").scrollTo(0, 0);
  }, []);