React-Router v4: Wie behandeln Sie "/" Seite als Synonym für andere Seite?

Question

Ich habe einen Server, der die gleiche einzelne Seite-App für mehrere URLS macht:

/ 
/A 
/B 

I A wollen als "Home" -Seite handeln. So eine Browser-Anfrage an "/" oder "/ A" sollte das gleiche anzeigen.

Insbesondere habe ich Links zu den Seiten A und B, und ich möchte, dass der Link zu A für "/" und "/ A" als aktiv markiert wird.

So bin ich mit so etwas wie:

<NavLink to="/A" activeClassName='nav-active'>Go to A</NavLink> 
<NavLink to="/B" activeClassName='nav-active'>Go to B</NavLink> 

<Router> 
<Route path='/A' component={A} /> 
<Route path='/B' component={B} /> 
</Router> 

Wie würde ich "/" als Synonym für "/ A" zu machen? Was ich versuchte:

• andere Route mit path="/" fügt hinzu: dies in zwei Komponenten führt
• mit einem regexp wie path="/(A)?" angezeigt wird: dies die richtige Komponente zeigt, aber die Verbindung ist nicht so aktiv

markiert

Soll ich es als eine serverseitige Umleitung implementieren statt (nur machen / eher zu /A umleiten als den gleichen Seiteninhalt dienen?)

Answer 1

Es scheint wie ein Redirect der Trick

<Router> 
<Route path='/A' component={A} /> 
<Route path='/B' component={B} /> 
<Route path='/' render={() => (
    <Redirect to='/A' /> 
)} /> 
</Router> 

Answer 2

Sie hinzufügen können exact={true}

<Router> 
    <Route path='/' exact={true} component={A} /> 
    <Route path='/A' exact={true} component={A} /> 
    <Route path='/B' exact={true} component={B} /> 
</Router>