score:2

I'm surprised you're not seeing any errors for a couple reasons:

  1. react-router-dom v6 no longer exposes a history object to use for navigation. It's replaced with a useNavigate hook that returns a navigate function.
  2. react-router-dom v6 Route components also no longer pass any route props (i.e. history, location, and match), they just don't exist. In other words, this.props.history is undefined and should throw an error when attempting to invoke the push function.

Since Login is a class component you'll need to create your own custom withRouter component to grab the navigate function and pass it to Login as a prop.

const withRouter = Component => props => {
  const navigate = useNavigate();
  return (
    <Component {...props} navigate={navigate} />
  );
};

...

class Login extends Component {
  constructor(){
    super();
    this.state = {
        email: '',
        password: '',
        errors: {}
    }
  }

  handleSubmit = (event) => {
    event.preventDefault();
    const userData = {
      email: this.state.email,
      password: this.state.password
    }
    
    axios
    .post("/loginUser", userData)
    .then(res => {
      console.log(res.data);
      localStorage.setItem('FBIdToken', `Bearer ${res.data.token}`);
      this.props.navigate('/');
    })
    .catch((err) => {
      console.log("ERROR inside loginUser.js");
    })
  }

  ...

  render() {
    ...
    return (
      ...
    )
  }
}

export default withRouter(Login);

Related Query

More Query from same tag