2017-02-06 6 views
1

Ich bin verwirrt darüber, wie und wann Sie getChildRoutes verwenden können, weil es Teil von PlainRoute ist. Wie erreichst du überhaupt PlainRoute? Anstatt also <Route> Komponenten zu bauen, kann ich <PlainRoute> s verwenden und dann innerhalb der Komponente, die es gerendert hat, getChildRoutes haben? Was bezieht sich auf partialNextState?Wann verwenden Sie React-Router getChildRoutes?

Antwort

1

Plain Routen sind ganz normale JavaScript-Objekte und kann wie so in <Router> verwendet werden:

const routes = { 
    path: '/', 
    component: App, 
    indexRoute: { 
    component: Home, 
    }, 
    childRoutes: [ 
    { path: 'page1', component: Page1 }, 
    { 
     path: 'page2', 
     component: SomeWrapper, 
     childRoutes: [ 
     { path: 'subpage1', component: Subpage1 }, 
     ], 
    }, 
    ], 
}; 

ReactDOM.render(<Router history={ browserHistory } routes={ routes }/>, document.body); 

Das heißt, die indexRoute - falls vorhanden - entspricht ein <IndexRoute> als Kind eines <Route> zum Hinzufügen und childRoutes entspricht dem Hinzufügen von Kind <Route> s. Beide akzeptieren dieselben Attribute wie die entsprechenden JSX-Tags, die Requisiten akzeptieren.

Einfache Routen sind zum Beispiel nützlich, um Ihre Routendefinition in mehreren Dateien aufzuteilen. In einer großen Anwendung kann es nützlich sein, Seiten von ihrem genauen Standort in der Routenhierarchie zu entkoppeln und die Routenhierarchie aufzubauen, indem childRoutes in unmittelbare übergeordnete Module importiert wird, anstatt die gesamte Routenhierarchie fest in das Stammmodul zu schreiben. Es ist auch einfach, wiederverwendbare Navigationskomponenten wie Tab-Container und Breadcrumbs zu erstellen, wenn Sie einfache Routen verwenden, da die Routen selbst dann als Requisiten gesendet werden können, die die Links definieren, die diese Komponenten enthalten sollten.

getChildRoutesgetIndexRoute und asynchron sind Varianten der childRoutes und indexRoute Attribute und für dynamisches Routing und Code-Splitting ermöglichen. Zum Beispiel könnten Sie für Spaß machen getChildRoutes rekursiv auf sich beziehen. Ich weiß nicht, was partialNextState sein soll, und ich habe es nie gebraucht.

Verwandte Themen