Ich kann anscheinend nicht finden, wie Abfrageparameter mit dem React-Router ohne Verwendung aktualisiert werden können <Link/>
. hashHistory.push(url)
Es scheint keine Abfrageparameter zu registrieren, und es scheint nicht so, als könnten Sie ein Abfrageobjekt oder etwas anderes als zweites Argument übergeben.
Wie ändere ich die URL von /shop/Clothes/dresses
in /shop/Clothes/dresses?color=blue
in React-Router ohne zu verwenden <Link>
?
Und ist eine onChange
Funktion wirklich die einzige Möglichkeit, auf Änderungen an Abfragen zu warten? Warum werden Abfrageänderungen nicht automatisch erkannt und auf die Parameteränderungen reagiert?
reactjs
react-router
claireablani
quelle
quelle
Antworten:
Innerhalb der
push
Methode vonhashHistory
können Sie Ihre Abfrageparameter angeben. Zum Beispiel,oder
In diesem Repository finden Sie weitere Beispiele zur Verwendung
history
quelle
router.push({ pathname: '/path', state: { color: 'blue', size: 10 }, });
Beispiel mit React-Router v4, Redux-Thunk und React-Router-Redux (5.0.0-alpha.6).
Wenn der Benutzer die Suchfunktion verwendet, möchte er, dass er einen URL-Link für dieselbe Abfrage an einen Kollegen senden kann.
quelle
react-router-redux
ist veraltet<Redirect>
Tag gerendert wird , Link zur DokumentenseitewithReducer
HOC einwickeln, wodurch Sie diehistory
Requisite erhalten. Und dann kannst du rennenhistory.push({ search: querystring }
.Johns Antwort ist richtig. Wenn ich mit Params zu tun habe, brauche ich auch eine
URLSearchParams
Schnittstelle:Möglicherweise müssen Sie Ihre Komponente auch mit einem
withRouter
HOC umschließen, z.export default withRouter(YourComponent);
.quelle
withRouter
ist ein HOC, kein Dekorateurquelle
Von DimitriDushkin auf GitHub :
oder
quelle
Die Verwendung des Abfragezeichenfolgenmoduls wird empfohlen, wenn Sie ein Modul benötigen, um Ihre Abfragezeichenfolge einfach zu analysieren.
Hier leite ich nach erfolgreicher Google-Passport-Authentifizierung, die mit Token als Abfrageparameter zurückgeleitet wird, vom Node.js-Server zurück zu meinem Client.
Ich analysiere es mit dem Abfragezeichenfolgenmodul, speichere es und aktualisiere die Abfrageparameter in der URL mit Push von React -Router-Redux .
quelle
Ich bevorzuge, dass Sie die folgende Funktion verwenden, die
ES6
Stil ist:quelle
Es kann auch so geschrieben werden
quelle