Vue-Router:不显示嵌套路由

Question

使用嵌套管线时，不会显示零部件。如果不使用嵌套布线，元件将按预期显示。对于嵌套路由我可能做错了什么，有什么想法吗？

import ManufacturersReport from "@/components/ManufacturersReport";
import Reports from "@/components/Reports";

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: "/reports",
      name: "Reports",
      component: Reports,
      children: [
        { path: "manufacturer_report", component: ManufacturersReport }
      ]
    }
  ],
  mode: "history"
});


<template>
  <header class="header">
    <h1>Reports</h1>
    <div id="nav">
      <router-link to="/reports/manufacturer_report">MF Report</router-link>|
    </div>
  </header>
</template>

Answer 1

我通过将<router-view></router-view>添加到我的模板代码中使其正常工作。

<template>
  <header class="header">
    <h1>Reports</h1>
    <div id="nav">
      <router-link to="/reports/manufacturer_report">MF Report</router-link>|
      <router-link to="/ping">Reports</router-link>
      <router-view></router-view>
    </div>
  </header>
</template>