React Router: регистрация каждого доступа к определенному маршруту

Question

В React у меня есть такой код:

<Router basename='/app'>
  <main>
    <Menu active={menu} close={this.closeMenu} />
    <Overlay active={menu} onClick={this.closeMenu} />
    <AppBar handleMenuIcon={this.handleMenuIcon} title='Test' />
    <Route path='/customers/:id' component={Customers} />
    <Route path='/products/:id' component={Products} />
  </main>
</Router>

Каждый раз, когда осуществляется доступ к /customers/:id или /products/:id, я хочу зарегистрировать доступ, сделав ajax-вызов к бэкэнд-службе.Поля, которые я буду регистрировать, включают в себя URL-адрес реферера, текущий URL-адрес и случайно сгенерированный идентификатор сеанса (случайное целое число 64). Как лучше всего это сделать, когда я использую компонент Router из react-router версия 1.0.0.

Answer 1

На этот вопрос дан ответ https://stackoverflow.com/a/44410281/5746996

Но по сути:

@withRouter
class App extends React.Component {

  static propTypes = {
    location: React.PropTypes.object.isRequired
  }

  // ...

  componentDidUpdate(prevProps) {
    if (this.props.location !== prevProps.location) {
      this.onRouteChanged();
    }
  }

  onRouteChanged() {
    console.log("ROUTE CHANGED");
  }

  // ...
  render(){
    return <Switch>
        <Route path="/" exact component={HomePage} />
        <Route path="/checkout" component={CheckoutPage} />
        <Route path="/success" component={SuccessPage} />
        // ...
        <Route component={NotFound} />
      </Switch>
  }
}

Используйте свойство location в свойстве props при добавлении react-router.Проверьте, изменилось ли оно с каждым обновлением - если оно есть, вы можете отправить его.