title: VueRouter route should select first child by default
body: <p>Hi everyone i'm using Vue-Router 2.5.3 and i have the following Route structure.</p>
  
  <pre><code> path: "/admin", component: require("./views/layouts/MasterLayout.vue"), meta: { requiresAuth: true }, children: [
                  { path: 'dashboard', component: require("./views/Dashboard.vue"), alias: "/", name: "dashboard" },
  
                  { path: 'upload', component: require("./views/Upload.vue"), name: "upload", redirect: {name: 'upload.photo'}, children: [
  
                      {
                          path: 'photo',
                          component: require("./components/Uploaders/ImagesUploader.vue"),
                          name: "upload.photo",
                          props: { selected: true, successEndpoint: "/api/v1/upload/complete", uploadEndpoint: "/api/v1/upload" }
                      },
                      {
                          path: 'video',
                          component: require("./components/Uploaders/VideoUploader.vue"),
                          name: "upload.video",
                          props: { selected: true, successEndpoint: "/api/v1/upload/complete", uploadEndpoint: "/api/v1/upload" }
                      }
  
                  ] },
  </code></pre>
  
  <p>And i have an issue with this configuration, whenever i navigate to "admin/upload" it shows a blank page, i want it to show "admin/upload/photo" by default even if my users navigate to "admin/upload" how can i acheive this in Vue Router?</p>
  
  <p>I've already tried defining aliases in both "upload" and in the child routes and nothing happened, then i tried to define the <strong>redirect</strong> key in the "upload" parent route as well and again blank page... </p>
  
  <p>I don't quite get what im going wrong, is it the fact that my structure has two levels of nesting? But if that's a problem how do i define these routes using only one level of nesting?</p>