VueRouter 路由应该默认选择第一个子节点答案

【问题标题】：VueRouter route should select first child by defaultVueRouter 路由应该默认选择第一个子节点
【发布时间】：2017-07-25 10:49:43
【问题描述】：

大家好，我使用的是 Vue-Router 2.5.3，我有以下路由结构。

 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" }
                    }

                ] },

我对此配置有疑问，每当我导航到“管理员/上传”时，它都会显示一个空白页面，我希望它默认显示“管理员/上传/照片”，即使我的用户导航到“管理员/上传”如何在 Vue Router 中实现这一点？

我已经尝试在“上传”和子路由中定义别名但没有任何反应，然后我尝试在“上传”父路由中定义 redirect 键空白页...

我不太明白我出了什么问题，是因为我的结构有两层嵌套吗？但如果这是一个问题，我如何只使用一层嵌套来定义这些路由？

【问题讨论】：

标签： vue.js vue-router

【解决方案1】：

别管大家，有点愚蠢的问题......（今天在办公室度过了糟糕的一天）

只需添加

alias: "/"

到您想用作默认的子路由...

所以在我的情况下，“照片”可能会变成

 { 
    path: 'photo',
    component: require("./components/Uploaders/ImagesUploader.vue"),
    name: "upload.photo",
    alias: "/",
    props: { selected: true, successEndpoint: "/api/v1/upload/complete", uploadEndpoint: "/api/v1/upload" }
 },

因为我们想要“photo”响应“upload”中的根目录，所以我们告诉它响应upload/“photo”和upload“/”，因为它们嵌套在“upload”中“上传”路由总是预先给任何孩子和它的别名。

【讨论】：