Zugriff auf history.listen in einer React-Komponente?

Question

Ich habe eine bestimmte Komponente, die jedes Mal benachrichtigt werden möchte, wenn der Benutzer navigiert. Gibt es eine Möglichkeit, auf den Verlauf zuzugreifen, der an den Router übergeben wurde?

<Router history={history}> 
    {// ...} 
</Router> 

Kinder Komponente:

var Component = React.createClass({ 
    componentDidMount: function() { 
    // history.listen(this.onRouteChange); 
    }, 
    onRouteChange: function() {}, 
    render: function() {...}, 
}); 

Answer 1

ich bemerkt habe, dass dies funktioniert:

import { browserHistory } from 'react-router'; 

var Component = React.createClass({ 
    componentDidMount: function() { 
    browserHistory.listen(this.onRouteChange); 
    }, 
    ... 
}); 

Aber es scheint, als ob ich die eigentliche Geschichte ging in den Router verwenden wollen würde eher als blind zu verwenden browserHistory. In einigen Fällen übergebe ich stattdessen hashHistory. Würde immer noch eine bessere Lösung schätzen!

Answer 2

Verwenden von withRouter ‚reagieren-Router‘ wie folgt aus:

import React from 'react' 
import PropTypes from 'prop-types' 
import { withRouter } from 'react-router' 

einer einfachen Komponente, die folgend den Pfadnamen der aktuellen Position zeigt. Funktioniert das gleiche für History Prop, verwenden Sie einfach Geschichte statt Ort dann.

Erstellen Sie eine neue Komponente, die "verbunden" ist (Redux // Terminologie) an den Router.

const ShowTheLocationWithRouter = withRouter(ShowTheLocation) 

Von: https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/withRouter.md