Vue Router嵌套路由子组件不显示怎么办?

Top丶慧慧 阅读 13

我用 Vue 3 + Vue Router 4 做了个后台管理页面,父路由是 /admin,想在里面嵌套子路由比如 /admin/users,但子组件就是不渲染出来。我在父组件里写了 ,路由配置也用了 children,是不是哪里写错了?

这是我的路由配置:

const routes = [
  {
    path: '/admin',
    component: () => import('@/views/AdminLayout.vue'),
    children: [
      {
        path: 'users',
        component: () => import('@/views/UserList.vue')
      }
    ]
  }
];

访问 /admin/users 时页面空白,控制台也没报错,真的搞不懂了……

我来解答 赞 4 收藏
二维码
手机扫码查看
1 条解答
艳艳 ☘︎
代码放这了,检查下 AdminLayout.vue 里面有没有 标签?嵌套路由得有这个才能显示子组件。
template
<div>
<h1>Admin Layout</h1>
<router-view></router-view>
</div>

确保这个标签在父组件里,然后刷新页面试试。
点赞
2026-03-23 21:02