如何在 ReactJS 中登录页面后重定向/转到用户配置文件

Question

我想重定向到User Profile页面，一旦用户使用有效的登录username和password

但是当我单击Login按钮时，它不会转到User Profile（但它会url按预期更改（http://localhost:3000/instructor/banuka）

它还应该显示InstructorLoginFormComponent它没有显示的内容。当我点击什么都没有发生但我能看到的仍然是login页面

这是我的 InstructorLoginForm.jsx

import React, { Component } from "react";

import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

import InstructorProfile from "./instructor-profile";

import InstructorLoginFormComponent from "./instructor-login-form-component";

export default class InstructorLoginForm extends Component {

  constructor(props) {

    super(props);

    this.state = {

      username: "",

      password: ""

    };

    this.onChangeUsername = this.onChangeUsername.bind(this);

    this.onChangePassword = this.onChangePassword.bind(this);

    this.handleOnClick = this.handleOnClick.bind(this);

  }

  onChangeUsername(e) {

    this.setState({

      username: e.target.value

    });

  }

  onChangePassword(e) {

    this.setState({

      password: e.target.value

    });

  }

  handleOnClick(e) {

    e.preventDefault();

    const path = `/instructor/${this.state.username}`;

    this.props.history.push(path);

  }