Vue Router 中如何正确使用路由元信息 meta?

文仙 Dev 阅读 25

我在 Vue 项目里用 Vue Router 配置路由时,想通过 meta 字段传递一些权限信息,但发现组件里拿不到。比如我这样写:

{
  path: '/admin',
  component: AdminPage,
  meta: { requiresAuth: true }
}

然后在组件里用 this.$route.meta.requiresAuth 却是 undefined,这是为啥?是不是写法不对?

我来解答 赞 3 收藏
二维码
手机扫码查看
1 条解答
子钊~
子钊~ Lv1
你写法没问题,但得确认是 Vue Router v3 还是 v4。
如果是 v3,this.$route.meta 肯定能拿到;如果是 v4,得用 useRoute() 的返回值里的 route.meta
你贴下你的 Vue Router 版本和组件里取 meta 的代码,我帮你定位具体哪错了——或者直接检查下路由配置是不是真的生效了,有时候嵌套路由的 meta 不会自动继承,得手动加。
总之,写法没错,能拿才怪,检查下版本和作用域,就行了。
点赞 2
2026-02-27 10:03