Multilanguage-Unterstützung in reagieren Router

Question

Ich bin mehrsprachige Website, wo die Sprache Präferenz ist Teil der URL, z.

http://example.com/<somepage>  (Russian, default) 
http://example.com/en/<somepage> (English) 
http://example.com/jp/<somepage> (Japanese) 
http://example.com/../    (etc) 

Alles ist in Ordnung, wenn ich Präfix für alle Sprachen verwendet werden:

<Route path="/:lang"> 
    <Route path="somepage" component={Somepage}/> 
</Route> 

Aber für Standardsprache, muss ich die Sprache nicht in URL enthalten, wie im Beispiel gezeigt. In fluxible Router kann es durch die Verwendung regexp in Weg gelöst werden:

path: '/:lang([a-z]{2})?/<somepage>' 

Aber es funktioniert nicht in Router reagieren, weil Pfad muss ein String sein, nicht ein regulärer Ausdruck. Irgendwelche Ideen, wie man diesen Anwendungsfall behandelt?

Answer 1

Haben Sie versucht, Ihre Routen zu duplizieren? Scheint, für mich bis jetzt zu arbeiten.

var innerRoutes = (
    <Route> 
    <Route path="somepage" component={Somepage}/> 
    <Route path="otherpage" component={Otherpage}/> 
    </Route> 
); 

var routes = (
    <Route path="/" component={App}> 
    {innerRoutes} 
    <Route path=":lang"> 
     {innerRoutes} 
    </Route> 
    </Route> 
); 

Answer 2

Ihre Routen würde aussehen müssen:

<Router history={createBrowserHistory()}> 
    <Route component={App}> 
    <IndexRoute component={Home} /> 
    <Route path=':lang/'> 
     <Route path='about' component={About} /> 
    </Route> 
    <Redirect from='*' to='ru/about' /> 
    </Route> 
</Router> 

Der Schrägstrich im :lang/ zeigt an, dass es nur dann, wenn das, nachdem es (zB /de/about) URL enthält etwas angepasst werden, sonst besteht Redirect mit a gieriger Abgleich, der immer auf die Seite umleitet, die Sie im Parameter to angeben. Sie können mehr über Route Matching in the docs lesen.