Vuejs路由器链接到子组件

Question

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

首页

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

说我想链接到主页组件组件这可能吗。

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

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

Answer 1

您可以通过定义子路由来使用nested routes：

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/