Réactiver le routeur avec un paramètre de chemin optionnel

Je souhaite déclarer un chemin avec un paramètre de chemin optionnel, donc, lorsque je l'ajoute la page pour faire quelque chose de plus (par exemple, remplir certaines données):

Http: // localhost / application / path / to / page <= rendez la page http: // localhost / application / path / to / page / pathParam <= rendez la page avec certaines données selon le cheminParam

Dans mon routeur réactif, j'ai les chemins suivants, afin de supporter les deux options (c'est un exemple simplifié):

<Router history={history}> <Route path="/path" component={IndexPage}> <Route path="to/page" component={MyPage}/> <Route path="to/page/:pathParam" component={MyPage}/> </Route> </Router>

Ma question est, pouvons-nous le déclarer dans un seul itinéraire? Si je n'ajoute que la deuxième ligne, l'itinéraire sans paramètre n'est pas trouvé.

EDIT # 1:

La solution mentionnée ici à propos de la syntaxe suivante ne fonctionnait pas pour moi, est-elle appropriée? Existe-t-il dans la documentation?

 <Route path="/product/:productName/?:urlID?" handler={SomeHandler} />

Ma version réactive-routeur est: 1.0.3

L'édition que vous avez affichée était valide pour une ancienne version de React-router (v0.13) et ne fonctionne plus.

React Router v1, v2 et v3

Depuis la version 1.0.0 vous définissez les paramètres facultatifs avec:

 <Route path="to/page(/:pathParam)" component={MyPage} />

Et pour plusieurs paramètres optionnels :

 <Route path="to/page(/:pathParam1)(/:pathParam2)" component={MyPage} />

Vous utilisez des parenthèses ( ) pour envelopper les parties facultatives de l'itinéraire, y compris la barre oblique principale ( / ). Consultez la page Guide de correspondance d'itinéraire de la documentation officielle.

Remarque: Le paramètre :paramName correspond à un segment d'URL jusqu'à la prochaine / ? , Ou # . Pour en savoir plus sur les chemins et params spécifiquement, lisez plus ici .

React Router v4

React Router v4 est fondamentalement différent de v1-v3, et les paramètres de chemin optionnels ne sont pas explicitement définis dans la documentation officielle non plus.

Au lieu de cela, vous êtes invité à définir un paramètre de cheminement que le chemin d'accès à la regexp comprend. Cela permet une plus grande flexibilité dans la définition de vos chemins, tels que la répétition des patters, des caractères génériques, etc. Donc, pour définir un paramètre en option, vous ajoutez un point d'interrogation ( ? ).

En tant que tel, pour définir un paramètre facultatif, vous faites:

 <Route path="/to/page/:pathParam?" component={MyPage} />

Et pour plusieurs paramètres optionnels :

 <Route path="/to/page/:pathParam1?/:pathParam2?" component={MyPage} />

Remarque: React Router v4 est incompatible avec le relais réacteur-relais ( lire plus ici ). Utilisez plutôt la version v3 ou antérieure (v2 recommandé).

Pour les utilisateurs de React Router v4 arrivant après une recherche, les paramètres facultatifs dans un <Route> sont désignés par a ? suffixe.

Voici la documentation pertinente:

https://reacttraining.com/react-router/web/api/Route/path-string

Chemin: chaîne

Tout chemin d'URL valide que path-to-regexp comprend.
 <Route path="/users/:id" component={User}/> 

https://www.npmjs.com/package/path-to-regexp#optional

Optionnel

Les paramètres peuvent être suffixés avec un point d'interrogation (?) Pour rendre le paramètre optionnel. Cela rendra également le préfixe facultatif.

Exemple simple d'une section paginée d'un site auquel on peut accéder avec ou sans numéro de page.

 <Route path="/section/:page?" component={Section} />