Component:
import { Navigate } from 'react-router-dom';
 
const UserProfile = ({ loggedIn }) => {
  if (!loggedIn) {
    return (
      <Navigate to='/' />
    )
  }
 
  return (
    // ... user profile content here
  )  
}

Hook:
import { useNavigate } from `react-router-dom`;
 
export const ExampleForm = () => {
 
  const navigate = useNavigate()
 
  const handleSubmit = e => {
    e.preventDefault();
    navigate('/')
  }
 
  return (
    <form onSubmit={handleSubmit}>
      {/* form elements */ }
    </form>
  )
}

navigate(-1); // go back button 
navigate(1); // go forward button 
navigate(-3); // go back 3 URLS in history stack

The Navigate Component, if rendered, will send the user to specified link. Otherwise component renders normally.

<Start Code Here

To pass information from parent routes down to nested child routes.

<Start Code Here

Information