2017-01-26 21 views
3

Мне интересно, какой будет лучший шаблон для подписки на изменения истории браузера с последней версией react-router. Я читал текущий documentation, но он выглядит как единственный вариант, о котором упоминается, путем явного поиска реквизита, переданного контейнером <Match/>, функции render или component. Это решение также описано здесь:В React Router v4 можно ли подписаться на изменения маршрута?

https://stackoverflow.com/a/41006114/2817257

Но что, если я хотел бы получить параметры маршрута глубже в дереве компонентов в чистом виде?

Я думаю о создании контейнерного компонента, который извлекает из контекста router и подписывается на изменения местоположения. Тем не менее, с текущей версией 4.0.0-alpha.6, даже если router объект уже в контексте, оно только содержит следующие методы:

  • blockTransitions
  • createHref
  • ReplaceWith
  • transitionTo

которые не очень перспективны, потому что похоже, что router не подвергает объект history вообще. Может быть, есть какой-то другой объект, который добавлен в контекст, который может быть полезен?

ответ

0

react-router документы закрыты банкоматом, но в v3 вы можете передать an onUpdate function в качестве опоры для компонента Router, чтобы прослушивать изменения состояния маршрутизатора.

Другой вариант заключается в импорте browserHistory, который реализуется с history (опять v3 знания как v4 документы вниз) и подписаться на изменения истории с listen, как этот

import { browserHistory } from 'react-router' 

browserHistory.listen((location, action) => { 
    // do whatever you need here 
}) 
+1

Спасибо за ответ. Я думаю, что, к сожалению, экземпляр 'browserHistory' больше не доступен в' response-router' v4. –

+0

Вы можете импортировать createHistory из 'history/createBrowserHistory', назначить вызов fn переменной и установить ее в поддержку истории на маршрутизаторе. Тогда у вас будет доступ к истории, где бы ни находилась ваша историческая переменная. – Ryan

+0

Также обратите внимание, что вызовы history.pushState() и history.replaceState() не вызывают событие popstate, поэтому этот ответ сам по себе не будет охватывать все изменения маршрута. – Ryan