How to change state based on Route change in React-Router?

I'm trying to figure out how to change the state of my Dashboard when a new route is clicked. This new route change needs to update the TopMenu component.

This is the code for the Dashboard

class Dashboard extends Component {
  constructor (props) {
    super(props)
    this.state = {
        selectedMenuItem: 'Now'
    }
  }

render () {
return (
  <Router>
    <div id='dashboard-container'>
      <LeftMenu/>

      <div className='column'>
        <TopMenu selectedMenuItem={this.state.selectedMenuItem} />

        <div id='content-container'>
          <div>
            <Switch>
              <Route exact path='/' component={Now} />
              <Route exact path='/surveys' component={Surveys} />
              <Route exact path='/my-questions' />
              <Route exact path='/feedback' />
              <Route exact path='/logout' />
              <Route render={function () {
                            return <p>Not Found</p>
                        }} />
            </Switch>
          </div>
        </div>
      </div>
        </div>

  </Router>

)}}

This is the code for the TopMenu

class TopMenu extends Component {
  render () {
    return (
       <h3>{this.props.selectedMenuItem}</h3>
    )
  }
}

How do I listen to a change in React Router such that I can change the 'selectedMenuItem' state variable in the Dashboard and pass that to TopMenu.

Thanks!