import { useHistory } from 'react-router-dom';
function Home() {
const history = useHistory();
return <button onClick={() => history.push('/profile')}>Profile</button>;
}
In react-router-dom version 6
useHistory() is replaced by useNavigate() ;
import {useNavigate} from 'react-router-dom';
const navigate = useNavigate();
navigate('/home')
// useHistory() does not work inside an arrow function
// notice @ line 9 that the history.push() is inside a usual function. not an arrow function
let myComponent = () => {
const history = useHistory();
function routeChange(){
history.push("/author");
}
return(<>
<button onClick={ routeChange} > redirect </button>
</>)
}
// useHistory() has been changed in v6, so instead use useNavigate()
check out the source link
replaced by useNavigate