score:4

Accepted answer

for the / route you should use render like this:

<route exact path="/" render={() => {
  if (auth.isuserauthenticated()) { 
    (<dashboardpage)/>)
  } else {
    (<homepage/>)
  }
}} />

for your /logout route using <redirect>

<route path="/logout" render={() => {
    auth.deauthenticateuser();
    return <redirect to={{ pathname: "/login" }} />;
    }}
/>

score:2

i post a second solution for the /logout path using withrouter and this.props.history.push('/login').

  1. point the /logout route to its own component "logout"
  2. wrap the logout component with withrouter method from react-router-dom.

logout.js

import react, { component } from "react";
import auth from "../modules/auth";
import { withrouter } from "react-router-dom";

class logout extends component {
  constructor(props) {
    super(props);
    this.handlelogout = this.handlelogout.bind(this);
  }
  handlelogout() {
    auth.deauthenticateuser();
    this.props.history.push("/login");
  }
  render() {
    return (
      <div>
        {this.handlelogout()}
      </div>
    );
  }
}
export default withrouter(logout);

Related Query

More Query from same tag