React router 4 does not update view on link, but does on refresh

Question

I am using the following simple nav code

<Router>
  <Switch>
    <Route exact path='/dashboard' component={Dashboard} />
    <Route path='/dashboard/accounts' component={AccountPage} />
  </Switch>
</Router>

<NavLink exact to={'/dashboard'}
         disabled={this.props.item.disabled}
         activeClassName='active'>

<NavLink exact to={'/dashboard/accounts'}
         disabled={this.props.item.disabled}
         activeClassName='active'>

The URL changes but the view does not. It does however change when I refresh the page or manually go to that URL.

Answer 1

You can also use the:

import { withRouter } from 'react-router-dom';

And then on your export default, you do like this:

export default withRouter(connect(mapStateToProps, {})(Layout));

Because when you have an export connect, you need to tell that that component will be using the router.