How to redirect in react if the user logged in

March 22, 2022

Well before writing this question i have searched internet Basically it shows 3 solution i tried all they seems to be outdated

1. using history.push('/')

The problem i am facing with this method is that browser saying who the hell is push i dont know what she is to debug i try to console history i find it is undefined i have seen in the answer they

I am just copying their answers

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

function HomeButton() {
  let history = useHistory()

  function handleClick() {
    history.push("/home")
  }

  return (
    <button type="button" onClick={handleClick}>
      Go home
    </button>
  )
}

but this does not work because useHistory import error it is outdated the other answers also is not usable like done with redirect again having import error

Please suggest me a good way to do this

>Solution :

history is depreciated since react-router version 6+, if you want to migrate then follow this link.

If you however freshly installed version 6+ then you can use useNavigate

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

function HomeButton() {
  let navigate = useNavigate()

  function handleClick() {
     navigate("/home")
  }

  return (
    <button type="button" onClick={handleClick}>
      Go home
    </button>
  )
}