Reagieren Router 4/path-to-regexp mehr optionalen Segmente

In 3 Reagieren Router ich Pfad so haben könnte:Reagieren Router 4/path-to-regexp mehr optionalen Segmente

/root(/id/:id)(/di/:di)

Die

/root 
/root/id/1 
/root/di/2 
/root/id/1/di/2

perfekte Übereinstimmung würde.

Ich kann nicht herausfinden, wie es in React Router 4 zu tun. Alle Beispiele tun nur eine Sache.

Express Route tester Verwendung Ich kann mit einer Route kommen wie

/root/id/:id?/di/:di?

Aber das würde passen nur

/root/id/1/di/2

Gibt es eine Lösung für dieses?

Quelle

2017-07-06 firedev

In reagieren Router V4 können Sie Ihre Regex innerhalb () umschließen. Also sollte diese Regex funktionieren und alle Pfade entsprechen, die Sie angegeben haben: /root(/id/|/di/):id*(/id/|/di/)?:di*. In der Express-Router Tester-Tool, dass Sie den Link gab, die Schlüssel wo nt zeigen sich mit dieser Regex aber es funktioniert, ich getestet auf localhost und Schlüssel funktioniert gut.

Beachten Sie, dass ich nicht ? nach dem ersten Capturing-Gruppe verwendet, d. H. (/id/|/di/), denn wenn ich tat, würde es optional werden und dann würde Pfad wie /root/12 auch übereinstimmen.

Quelle

2017-07-06 10:55:46 Zeus

können Sie bitte erarbeiten, wie diese Arbeit? Ich muss diesen Pfad konvertieren "entity ((/ contextId) (/: contextRelType)/aktiv (/: activeId) (/: activeRelType))" –

@SergeyOrlov ReactRouter v4 verwendet Pfad-zu-Regexp für passende Pfade, Sie können https://github.com/pillarjs/path-to-regexp#parameter-modifiers für Beispiele, die damit in Verbindung stehen. Der Zweck meines Beispiels war es, alle Fälle zu vergleichen, die in der ursprünglichen Frage angegeben sind. Der URL-Teil in Klammern '()' ist im Grunde Regex, zum Beispiel passt dieses Muster '/ hey (/ jerry |/tom)' zu beiden Pfaden '/ hey/tom' und'/hey/jerry', während das '?' danach macht es optional. – Zeus

Hier ist, wie ich es am Ende tat, es ist ein litte bisschen lächerlich, aber es funktioniert:

<Route 
    path="/root/:firstKey?/:firstId?/:secondKey?/:secondId?" 
    render={({ match: { params: { firstKey, secondKey, firstId, secondId } } }) => { 
     const params = { [firstKey]: firstId, [secondKey]: secondId } 
     return (<Whatever {...params} />) 
    }} 
    />

Quelle

2017-07-06 12:09:42 firedev

Reagieren Router 4/path-to-regexp mehr optionalen Segmente

Antwort

Verwandte Themen