title: Nested routes in react-router
body: <p>I'm setting up some nested routes within React-Router (v0.11.6 is what I'm working against) but whenever I try and access one of the nested routes it triggers the parent route.</p>
  
  <p>My routes look like this:</p>
  
  <pre><code>&lt;Route handler={App}&gt;
      &lt;Route name="home" path="/" handler={availableRoutes.Splash} /&gt;
      &lt;DefaultRoute handler={availableRoutes.Splash} /&gt;
  
      &lt;Route name="dashboard" handler={availableRoutes.Dashboard}&gt;
          &lt;Route name="dashboard-child" handler={availableRoutes.DashboardChild} /&gt;
     &lt;/Route&gt;
  
      &lt;NotFoundRoute handler={NotFound} /&gt;
  &lt;/Route&gt;
  </code></pre>
  
  <p>If I collapse the routes up so it looks like:</p>
  
  <pre><code>&lt;Route handler={App}&gt;
      &lt;Route name="home" path="/" handler={availableRoutes.Splash} /&gt;
      &lt;DefaultRoute handler={availableRoutes.Splash} /&gt;
  
      &lt;Route name="dashboard" handler={availableRoutes.Dashboard} /&gt;
      &lt;Route name="dashboard-child" path="/dashboard/dashboard-child" handler={availableRoutes.DashboardChild} /&gt;
  
      &lt;NotFoundRoute handler={NotFound} /&gt;
  &lt;/Route&gt;
  </code></pre>
  
  <p>It works fine. The reason I was nesting was because I will have multiple children under the "dashboard" and wanted them all prefixed with <code>dashboard</code> in the URL.</p>