Im trying to navigate to my shipping page but i keep getting this error-CodePudding

This is the error message

react-dom.development.js:11340 Uncaught TypeError: Cannot read properties of undefined (reading 'search')
at Login (Login.js:21:1)
at renderWithHooks (react-dom.development.js:14985:1)
at mountIndeterminateComponent (react-dom.development.js:17811:1)
at beginWork (react-dom.development.js:19049:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
at invokeGuardedCallback (react-dom.development.js:4056:1)
at beginWork$1 (react-dom.development.js:23964:1)
at performUnitOfWork (react-dom.development.js:22776:1)
at workLoopSync (react-dom.development.js:22707:1)

This is my code

my Login.js

const Login = ({ history, location }) => {

const [email, setEmail] = useState('');
const [password, setPassword] = useState('');

const alert = useAlert();
const dispatch = useDispatch();

const { isAuthenticated, error, loading } = useSelector(state => state.auth);

const redirect = location.search ? location.search.split('=')[1] : '/'

const navigate = useNavigate();
// navigate('/')



useEffect(() => {

    if (isAuthenticated) {
        navigate(redirect)
    }

    if (error) {
        alert.error(error);
        dispatch(clearErrors());
    }

}, [dispatch, alert, isAuthenticated, error, navigate, redirect])


const submitHandler = (e) => {
    e.preventDefault();
    dispatch(login(email, password))
}

return ()} export default Login

the error seems to be coming from my "location.search" because in my vscode that part is line 21. Has there been any recent change in documentation?

CodePudding user response：

Where location & history props come from? If your are using hooks, I assume this should not come from props, but from hooks

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

const Login = () => {
  const history = useHistory();
  const location = useLocation();
  ...
}