Attempted import error: 'useHistory' is not exported from 'react-router-dom'

Solution 1:

In react-router-dom v6 useHistory() is replaced by useNavigate().

You can use:

import { useNavigate } from 'react-router-dom';
const navigate = useNavigate();
navigate('/home');

Solution 2:

Replace useHistory with useNavigate then

const navigate = useNavigate();

and then replace history.push('/path') with navigate('/path')

Change history.replace('/path') with navigate('/path', { replace: true })

Want to use state in push/navigate do navigate('/path', { state: { name:'Xyz' }})

Solution 3:

I upgraded the version of react-router-dom to

5.2.0

and it is working now.

Solution 4:

If you must stick to the latest react-router-dom v6.0.0, then replace useHistory with useNavigate. Else, downgrade your react-router-dom to v5.2.0 and your code works as it should.

Solution 5:

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

const navigate = useNavigate();

const confirm = (e) => {
    navigate.push('/')
}