debugreactCritical
Attempted import error: 'useHistory' is not exported from 'react-router-dom'
Viewed 0 times
exportedusehistoryimporterrorfromdomattemptedreactnotrouter
Problem
useHistory giving this error:
Failed to compile ./src/pages/UserForm/_UserForm.js Attempted import
error: 'useHistory' is not exported from 'react-router-dom'. This
error occurred during the build time and cannot be dismissed.
react-router-dom version:
4.3.1
Code:
Failed to compile ./src/pages/UserForm/_UserForm.js Attempted import
error: 'useHistory' is not exported from 'react-router-dom'. This
error occurred during the build time and cannot be dismissed.
react-router-dom version:
4.3.1
Code:
import React, { useState, Fragment } from 'react';
import FormUserDetails from './FormUserDetails';
import FormPersonalDetails from './FormPersonalDetails';
import Confirm from './Confirm';
import Success from './Success';
import Button from '@material-ui/core/Button';
import { Grid, makeStyles } from '@material-ui/core';
import { useHistory } from 'react-router-dom';
function UserForm() {
const [step, setStep] = useState(1);
const history = useHistory();
const StepButtons = (props) => (
{props.value !== 'initial' ?
previousStep(e)}>Back :
reGenerate(e)}>Re-generate
}
{
props.value === 'confirm' ?
confirm(e)}>Confirm :
props.value !== 'final' ?
nextStep(e)}>Continue :
null
}
);
const nextStep = (e) => {
e.preventDefault();
setStep(prevState => prevState + 1)
}
const previousStep = (e) => {
e.preventDefault();
setStep(prevState => prevState - 1)
}
const reGenerate = (e) => {
e.preventDefault();
}
const confirm = (e) => {
history.push('/')
}
return (
Hello
)
}
export default UserFormSolution
In react-router-dom v6
You can use:
useHistory() is replaced by useNavigate().You can use:
import { useNavigate } from 'react-router-dom';
const navigate = useNavigate();
navigate('/home');
Context
Stack Overflow Q#62861269, score: 801
Revisions (0)
No revisions yet.