Navigieren zu einer anderen Route programmatisch

Ich habe einen Anwendungsfall, wo ich eine Liste von Elementen in einer Komponente ähnlich wie Vanille HTML-Auswahl haben. Ich möchte, wenn der Benutzer auf eine der Elemente in der Liste klickt, sollte sich die Route ändern. Kann ich einen Regex verwenden, während ich eine Route definiere und die Route ändere, indem ich eine API-Methode vom Reagier-Router verwende, das onValueChange-Ereignis von select?Navigieren zu einer anderen Route programmatisch

Beispiel Root-Route:/ Listendaten: Katze, Hund, Elefant

Wenn jemand auf Katze klickt Ich möchte ihn/Cat navigiert werden, ähnlich/Hund,/Elefant.

Quelle

2017-09-07 Lokesh Agrawal

Oder verwenden Sie einfach die 'Link' Komponente (von react-router) für jeden Punkt auf Ihrer Liste mit einer definierten Route. Wenn ich die Frage –

nicht missverstanden habe, möchte ich die Link-Komponente nicht verwenden, weil ich eine Aktion versenden und das Stück eines in redux gespeicherten Anwendungsstatus (zB selectedAnimal: Cat) vor der Navigation zu einer anderen Route ändern möchte. –

ok, also rufen Sie eine Aktion für Redux zu versenden .. nach dem Versand verwenden Sie 'browserHistory', um die URL zu aktualisieren –

So nach ein wenig darüber zu reden. herausgefunden, was Sie tun wollten.

müssen Sie in reagieren-Router eine neue Route definieren, die Sie für diese Geschichte ändern können .. so etwas wie dieses:

<Route exact path="/:name" component={SomeComponent} />

in Ihrer Komponente Sie Zugriff auf diese „name“ haben über this.props.params.name

Sie können auch eine Aktion rufen Sie den Laden, bevor die Aktualisierung dieser Route

Hinweis zu aktualisieren: wenn Sie mit v2 bleiben ... Sie sollten Ihre Aktionen machen retur n ein Versprechen, damit Sie das Ereignis einfach in Ihrer Komponente verketten können. aka:

Quelle

2017-09-07 04:10:39

'importieren Sie {browserHistory} von 'react-router' und aktualisieren Sie dann die URL browserHistory.push ('/ Cat')' BrowserHistory ist nicht in routerv4 verfügbar –

@LokeshAgrawal sieht aus wie browserHistory in react router v3 ist. Entweder können Sie den Router über Requisiten wie Sie haben oder Sie können eine Hilfsfunktion machen, um Ihnen die gleiche Funktionalität zu geben, die browserHistory bietet. –

Navigieren zu einer anderen Route programmatisch

Antwort

Verwandte Themen