Блог

Я использую react-router версии 6, и я должен использовать экземпляр истории.

Я установил его с помощью

 yarn add history react-router-dom@next
  

Один из способов использования экземпляра истории, я думаю, это должно быть с версией 5, — использовать перехват useHistory, импортированный из react-router-dom

этот код отлично работает с версией 5, но с версией 6 он не работает

 import { useHistory } from "react-router-dom";

const history = useHistory();

const onRedirectCallback = (appState) => {
        history.push(appState?.returnTo || window.location.pathname);
};
  

с версией v6 у меня возникает эта ошибка

Ошибка при попытке импорта: ‘useHistory’ не экспортируется из ‘react-router-dom’.

Вам нужно использовать useNavigate hook и новый navigate API.

 import { useNavigate } from "react-router-dom";

const navigate = useNavigate();

const onRedirectCallback = (appState) => {
        navigate(appState?.returnTo || window.location.pathname);
};
  

 // import

const { useNavigate } from 'react-router-dom'

const navigate = useNavigate()

navigate({ pathname: './webpage/path' }) 

navigate({ pathname: './webpage/path' }, { replace: true })