Ich habe ein kleines Problem bei der Migration von React-Router v3 auf v4. in v3 konnte ich das überall machen:
import { browserHistory } from 'react-router';
browserHistory.push('/some/path');
Wie erreiche ich das in v4?
Ich weiß, dass ich die Hoc- withRouter
, Reaktionskontext- oder Event-Router-Requisiten verwenden kann, wenn Sie sich in einer Komponente befinden. aber das ist bei mir nicht der Fall.
Ich suche nach der Äquivalenz von NavigatingOutsideOfComponents in v4
reactjs
react-router
Storm_Buster
quelle
quelle
Antworten:
Sie benötigen lediglich ein Modul, das ein
history
Objekt exportiert . Dann würden Sie dieses Objekt in Ihr Projekt importieren.Anstatt einen der integrierten Router zu verwenden, würden Sie dann die
<Router>
Komponente verwenden.quelle
createHashHistory
wenn Sie verwendet habenHashRouter
.Das funktioniert! https://reacttraining.com/react-router/web/api/withRouter
quelle
this.props.history.push('/some_route');
müssen, damit es funktioniert.const Component = props => {... // stuff}
undexport default withRouter(Component)
arbeitet für mich an einer zustandslosen KomponenteSimiliary zu akzeptierte Antwort , was Sie tun können , Gebrauch ist
react
undreact-router
sich um Ihnenhistory
Objekt , das Sie Rahmen in einer Datei kann und dann den Export.history.js
Sie importieren später die Komponente und hängen sie ein, um die Verlaufsvariable zu initialisieren:
Und dann können Sie einfach in Ihre App importieren, wenn sie gemountet wurde:
Ich habe sogar ein npm-Paket gemacht , das genau das tut.
quelle
Wenn Sie Redux und Redux-Thunk verwenden, ist die beste Lösung die Verwendung von React-Router-Redux
quelle
Basierend auf dieser Antwort, wenn Sie nur ein Verlaufsobjekt benötigen, um zu einer anderen Komponente zu navigieren:
quelle
In App.js.
Dann in einer untergeordneten Komponente:
quelle
Im speziellen Fall von
react-router
ist die Verwendungcontext
ein gültiges Fallszenario, zSie können über den Routerkontext auf eine Instanz des Verlaufs zugreifen, z
this.context.router.history
.quelle