reactjs - React Router after reload always redirected to dashboard

Question

i have one problem with react routers. It's my App class. I check my token, if it valid i do redirect to dashboard page.

class App extends Component {
constructor(props){
    super(props);
    this.checkAuth = this.checkAuth.bind(this);
}

checkAuth(){
    if(localStorage.getItem(ACCESS_TOKEN)){
        getCurrentAccount().then(response => {
            this.props.onLoadCurrentAccount({ account: response, isAuthenticated: true });
            this.props.history.push('/');
        });
    }
}

componentDidMount() {
    this.checkAuth();
}

render() {
    return (
        <div>
            <Switch>
                <Route path='/login' component={Login}/>
                <Route path='/signup' component={Signup} />
                <PrivateRoute authenticated={this.props.account.isAuthenticated} path='/' component={CoreLayout} />
                <Route component={NotFound}/>
            </Switch>
        </div>
    );
}

}

Here i have different routes to other components if you authorized. Always when i try to reload page i go to '/' page. For example: i stay on '/contacts' but when i reload page i go to '/'. How can i fix it?

class CoreLayout extends Component {
render() {
    return (
        <div>
            <Menu/>
            <Switch>
                <Route exact path='/' component={Dashboard}/>
                <Route path='/contacts' component={Contacts}/>
                <Route path='/assignment' component={Assignment}/>
                <Route path='/tasks' component={Tasks}/>
            </Switch>
        </div>
    );
}

}

Thanks

Answer 1

Due to your componentDidMount() Method;

In componentDidMount() method you are calling checkAuth() method in which you are using

this.props.history.push('/');

so try to change checkAuth() method as per your requirement.