Merge pull request #3196 from taion/update-absolute-route-example

Update absolute path example in route config guide
remix-run · Mar 21, 2016 · cd30178 · cd30178
2 parents 2ba245a + 39478db
commit cd30178
Showing 1 changed file with 16 additions and 13 deletions.
diff --git a/docs/guides/RouteConfiguration.md b/docs/guides/RouteConfiguration.md
@@ -114,10 +114,10 @@ render((
     <Route path="/" component={App}>
       <IndexRoute component={Dashboard} />
       <Route path="about" component={About} />
+      <Route path="inbox" component={Inbox} />
 
       {/* Use /messages/:id instead of /inbox/messages/:id */}
       <Route component={Inbox}>
-        <Route path="inbox" />
         <Route path="messages/:id" component={Message} />
       </Route>
     </Route>
@@ -152,13 +152,15 @@ render((
     <Route path="/" component={App}>
       <IndexRoute component={Dashboard} />
       <Route path="about" component={About} />
+
+      <Route path="inbox" component={Inbox}>
+        {/* Redirect /inbox/messages/:id to /messages/:id */}
+        <Redirect from="messages/:id" to="/messages/:id" />
+      </Route>
+
       <Route component={Inbox}>
-        <Route path="inbox" />
         <Route path="messages/:id" component={Message} />
       </Route>
-
-      {/* Redirect /inbox/messages/:id to /messages/:id */}
-      <Redirect from="inbox/messages/:id" to="/messages/:id" />
     </Route>
   </Router>
 ), document.body)
@@ -194,17 +196,18 @@ const routes = {
   childRoutes: [
     { path: 'about', component: About },
     {
+      path: 'inbox',
       component: Inbox,
-      childRoutes: [
-        { path: 'inbox' },
-        { path: 'messages/:id', component: Message }
-      ]
+      childRoutes: [{
+        path: 'messages/:id',
+        onEnter: ({ params }, replace) => replace(`/messages/${params.id}`)
+      }]
     },
     {
-      path: 'inbox/messages/:id',
-      onEnter: (nextState, replace) => {
-        replace('/messages/' + nextState.params.id)
-      }
+      component: Inbox,
+      childRoutes: [{
+        path: 'messages/:id', component: Message
+      }]
     }
   ]
 }