2017-07-28 26 views
1

Ich möchte in der Lage sein, einen Link zu der gleichen Route zu erstellen, die ich bin, mit Ausnahme von Änderungen an einigen Parametern.React-Router: Ändern Sie einen einzelnen Parameter in der URL

In meiner Website entschied ich mich für eine URL wie folgt strukturiert: /list/:page(\d+)?/:filter?. Nun, in meiner Komponente habe ich Zugriff auf match (mit withRouter HOC). In meiner Situation enthält es

{ 
    isExact: true 
    params: {page: "3", filter: "duckbitt"} 
    path: "/listing/:page(\d+)?/:filter?" 
    url: "/listing/3/duckbitt" 
} 

Das ist sehr gut, da ich sowohl Parameter als auch den Pfad habe. Jetzt wirft dies 2 Fragen auf:

  1. Gibt es eine react-Router-Builtin-Lösung für eine solche Situation?
  2. Wenn nicht, gibt es eine mögliche Lösung mit path-to-regexp, oder ich sollte naiv suchen und ersetzen?

Danke

Antwort

1

Natürlich eine Lösung zeigt sich direkt nach der Frage der Veröffentlichung.

import pathToRegexp from 'path-to-regexp'; 
// (...) 
const toPath = pathToRegexp.compile(match.path); 
const newPath = toPath({ ...match.params, page: 666 }); 
console.log(newPath); // "/listing/666/duckbitt" 
Verwandte Themen