React-Router: Was ist der Zweck von IndexRoute?

102

Ich verstehe nicht, wozu IndexRoute und IndexLink dienen . Es scheint, dass in jedem Fall der folgende Code zuerst die Home-Komponente ausgewählt hätte, es sei denn, der Info-Pfad wurde aktiviert.

<Route path="/" component={App}>
  <IndexRoute component={Home}/>
  <Route path="about" component={About}/>
</Route>

vs.

<Route path="/" component={App}>
  <Route path="home" component={Home}/>
  <Route path="about" component={About}/>
</Route>

Was ist der Vorteil / Zweck hier des ersten Falles?

— Nick Pineda
quelle

Warum Homesollte im ersten Beispiel gewählt werden, es sei denn, der Pfad war /home? Lesen Sie die Erklärung in den Dokumenten: github.com/rackt/react-router/blob/master/docs/guides/basics/…

— Michelle Tilley

Sie können sich vorstellen, dass main eine Navigationsleiste ist und dass Home und About die Hauptseite sind, durch die Sie in der Navigationsleiste klicken können.

— Nick Pineda

Im oberen Beispiel /würde das Gehen Appmit Homeals Kind übergeben übergeben. Im unteren Beispiel gehen /machen würde Appmit keinem Home oder Aboutwiedergegeben werden, da weder ihren Wegen entsprechen.

— Michelle Tilley

Ohh !!! Könnten Sie das als Antwort geben, damit ich Ihnen Ehre machen kann? Danke dir!

— Nick Pineda

Bei der Änderung von v0.13 auf v1.0 wurde der Name von DefaultRouteauf geändert IndexRoute. Ich finde, dass 'Standard' den Zweck besser beschreibt. github.com/rackt/react-router/blob/master/…

— Clarkie

101

Im oberen Beispiel /würde das Gehen Appmit Homeals Kind übergeben übergeben. Im unteren Beispiel gehen /machen würde Appmit keinem Home noch Aboutgemacht werden, da weder ihren Wegen entsprechen.

Für ältere Versionen von React Router finden Sie weitere Informationen auf der Seite Indexrouten und Indexverknüpfungen der zugehörigen Version . Ab Version 4.0 verwendet React Router die IndexRouteAbstraktion nicht mehr , um dasselbe Ziel zu erreichen.

— Michelle Tilley
quelle

Was könnten wir diese Funktion in der Praxis nutzen?

— Seasonqwe

Beispielsweise können wir einen übergeordneten Container und mehrere untergeordnete Routen erstellen und eine dieser untergeordneten Routen als Standard festlegen (IndexRoute). Oder wenn wir keine untergeordnete Standardroute benötigen und den Benutzer darauf hinweisen müssen, dass er etwas auswählen soll (dann keine IndexRoute)

— Olga Gnatenko

@ AlexHopeO'Connor Danke, ich habe die zweite Hälfte der Antwort aktualisiert

— Michelle Tilley

Was bedeutet als Kind genau? Laden im Hintergrund? auf Requisiten zugreifen können? andere?

— StLia