Использование React Router withRouter

Как вы получаете контекст маршрутизации, местоположение, параметры и т.д. при использовании withRouter()?

import { withRouter } from 'react-router';

const SomeComponent = ({location, route, params}) => (
    <h1>The current location is {location.pathname}</h1>
);

const ComposedWithRouter = withRouter(SomeComponent);

Вы можете получить эту информацию, используя withRouter, или эти вещи должны быть явно переданы по дереву компонентов?

Ответы

Ответ 1

Итак, больше не пользуйтесь context. Все это доступно в реквизитах:

SomeComponent.propTypes = {
  location: React.PropTypes.shape({
    pathname: React.PropTypes.string,
    query: React.PropTypes.shape({
      ...
    })
  }),
  params: React.PropTypes.shape({
    ...
  }),
  router: React.PropTypes.object
}

const ComposedWithRouter = withRouter(SomeComponent);

Итак, тогда скажем в SomeComponent, что вы хотите отправить пользователя на новый маршрут, просто выполните this.props.router.push('someRoute')

Ответ 2

Получение местоположения и т.д. через withRouter было добавлено в Agent-маршрутизаторе версии 2.7. Дэн Абрамов рекомендует обновить до 3.0 для использования с маршрутизатором. До версии 2.7 он предоставлял только набор функций.