起因
今天遇到一个看起来很奇特的问题,实际上确是忽略了最基本的问题
看看问题是这样的,配置文件:
[
{
path: "/base_data_system",
name: "base_data_system",
component: () => import("../pages/MenuHome/menu"),
children: [
{
path: "event",
name: "event",
meta: { name: "事件数据管理" },
component: () =>
import("../pages/BasicDataHost/EventDataManagement/IndexAction")
},
{
path: "parts",
name: "parts",
meta: { },
children: [
{
path: "list",
name: "list",
meta: { name: "部件数据管理" },
component: () =>
import("../pages/BasicDataHost/Parts/PartsList/IndexAction")
},
{
path: "check",
name: "check",
meta: { name: "部件审核" },
component: () =>
import("../pages/BasicDataHost/Parts/WaitCheck/IndexAction")
}
]
},
]
}
]
这是一个4层的路由,访问路径为:/base_data_system/event/parts/list
看起来没任何问题,但就一直显示不出来,没有任何错误,直接蒙了
解决
又去翻一翻官方文档,网上找一下资料,总算想起了
删掉一个组件,问题在于少了一个<router-view />
总结
问题在于vue 路由如果路径是嵌套的,则需要<router-view />也要嵌套,如果少了一个,没有任何错误提示,所以对于发现路由问题,首先确认是不是 <router-view /> 没有