Question

如何在vue-router

中获取下一个路由

我有以下路线：/principal

{path: '/principal', component: Principal}

现在，我需要驱动其他具有相同网址的组件，新网址如下：

/principal/compa

是否可以让单个基本路径能够显示其他组件？

这样的事情（我知道vue-router不能像这样工作），但你怎么会遇到这种行为？

{ path: '/principal', component: Principal, subpath: { path: 'compa', component: 'CompA' } }

由于

Answer 1

VueRouter构造函数配置中有一个children选项，用于使用嵌套路由呈现Vue组件。

在这种特殊情况下，它将是：

{
   path: '/principal', 
   component: Principal,
   children: [{
    path: 'compa',  // it would match /principal/compa
    component: CompA
   }]
}

来自vue-router doc：

const router = new VueRouter({
  routes: [
    {
      path: '/user/:id',
      component: User,
      children: [ // <-- notice the children property
        {
          // UserProfile will be rendered inside User's <router-view>
          // when /user/:id/profile is matched
          path: 'profile',
          component: UserProfile
        },
        {
          // UserPosts will be rendered inside User's <router-view>
          // when /user/:id/posts is matched
          path: 'posts',
          component: UserPosts
        }
      ]
    }
  ]
});

有关详情，请查看 nested routes 。

如何基于基本路径生成子组件的路由

1 个答案: