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/