vue.js - Vuejs 路由器链接到子组件

Question

目前，我已将路由器设置为链接到页面组件。例如，这些页面组件中的每一个都有子组件。

首页

<slider></slider>
<section></section>
<section></section>
<section></section>
<panel></panel>

假设我想链接到 Home page components 组件是可能的。

所以路线是http://example.com/home/panel

以上只是一个示例，但正是我要寻找的理想情况。任何帮助都会很棒。

Answer 1

您可以使用 nested routes通过定义 child 的路线:

const routes = [{
  path: '/home',
  component: Home,
  children: [{
    path: 'panel',
    component: Panel
  }]
}]

然后在您的 Home 组件中放置一个 router-view 标签来为该组件提供服务:

<router-view></router-view>

这是 JSFiddle:https://jsfiddle.net/craig_h_411/srxafk39/