为什么不在vue路由器中运行我的嵌套子菜单

Question

当我点击子菜单项javascript时，它不会显示组件javascript.vue

[
{
path: "/",
name: "home",
component: Home
},
{
path: "/guide",
name: "guide",
component: () => import("./components/Guide.vue"),
children: [
{
path: "/guide/javascript",
name: "javascript",
component: () => import("./components/JavaScript.vue")
}
]
},
{
path: "/service",
name: "service",
component: () => import("./components/Service.vue")
},
{ path: "*", component: () => import("./components/404.vue") }
]

我在CodeSandbox 中有我的代码示例

Answer 1

javascript路由是一个子路由，它需要父组件(Guide.vue(中的<router-view>。

添加<router-view>以修复问题：

<!-- Guide.vue -->
<template>
<div class="hello">
<h1>Guide</h1>
<Top />
<router-view />
</div>
</template>

演示