嵌套路由-children

实际生活中的应用界面，通常由多层嵌套的组件组合而成。同样地，URL 中各段动态路径也按某种结构对应嵌套的各层组件，例如：

/user/foo/profile                     /user/foo/posts
+------------------+                  +-----------------+
| User             |                  | User            |
| +--------------+ |                  | +-------------+ |
| | Profile      | |  +------------>  | | Posts       | |
| |              | |                  | |             | |
| +--------------+ |                  | +-------------+ |
+------------------+                  +-----------------+

要在嵌套的出口中渲染组件，需要在 VueRouter 的参数中使用 children 配置

export default new Router({
    routes: [{
    path: "/main",component:Main,children: [{
    path: "user",component: User}, {
    path: "config",component: SystemConfig}]}]
})

注意:子路由中path切勿以/开头，否则被视为根路径(已踩坑)