[Solved]-How to navigate from one component to another by clicking a button using React router-Reactjs

To redirect the user you want to call push on the history object. To get the history object in a class component you can use the withRouter higher-order component, e.g.

class Login extends Component {
  render() {
    const { history } = this.props;

    return (
      <div>
       <button onClick={() => history.push('foo')}>Login</button>
      </div>
    );
  }
}

export const LoginWithRouter = withRouter(Login);

Source: https://dev.to/kozakrisz/react-router---how-to-pass-history-object-to-a-component-3l0j