React router this.props.history.push , pushing the location but not rendering the component

mouchin777

I have this in my app.js

      render() {
    //isAuthticated() is async, so we block the rendering until we have the result.
    if (!this.state.authenticationChecked) return null;
    return (
      <div>
        <Switch>
          <PrivateRoute name={"dashboard"} authed={this.state.isAuthenticated} path="/dashboard" render={(props) => <Calendario {...props} logout={this.logout} />} />
          <LifeExpectancyRoute name={"life_expectancy"} path="/lifeExpectancy" render={(props) => <LifeExpectancy {...props} setYearsRedirect={this.setYearsRedirect} />} />
          <Route path="/login" render={(props) => <LoginPage login={this.login} authed={this.state.isAuthenticated} {...props} />} />
        </Switch>
      </div>
    )
  }
}

export default compose(
  withRouter,
  connect(null, mapDispatchToProps)
)(App);

Ant then I have this function which i call when clicking an icon

  logout = () => {
    this.setState({
      isAuthenticated : false,
      authenticationChecked: false
    }, () =>{
      this.props.history.push("/dashboard")
    })

  }

But for some reason, it pushes the history, and i can see it in the navigation menu, but it wont load the component, I just have a blank screen. If i enter the address manually in the navigation bar, it works properly

mouchin777

It was an error with my code logic, this did the trick

    logout = () => {
    this.setState({
      isAuthenticated : false,
      authenticationChecked: true
    }, () =>{
      this.props.history.push("/login")
    })

  }

Collected from the Internet

Please contact [email protected] to delete if infringement.