Vue中的路由配置项meta(及权限登录不同的导航)
meta?
meta简单来说就是路由元信息 也就是每个路由身上携带的信息。
- 列举几个例子:
①.面包屑效果

路由信息:

页面:

②.可以在路由导航守卫跳转的时候判断有没有这个信息,如果有让跳转
如: 设置meta属性

设置路由守卫

③.根据不同的用户权限分配不同的路由导航
当我登录是,通过判断是管理员还是普通用户,引导他们进入不同的内容的index.vue组件页面。没错,只用一个页面,实现两种权限。

- 有多种方式 先来看下第①种:
可以提前创建几套路由规则 然后在需要切换的页面中进行引用

②.切换整套路由
- 首先要另外新创建一套路由,将所有的路由规则拷贝过去,只在这个一级路由的子路由那进行内容更改。

另一套路由:

- 然后在登录页面里面 通过判断后台返回的登录状态码(或根据导航守卫是否携带token) 分配不同的权限。

这样就能实现普通用户进入普通页面,超管进入超管页面了
总结了几个需要注意的事项:
①. 路由出口 放在哪,下级路由里的内容就显示在什么地方

②. 给属性绑定值时,一定记得加上"v-bind"或者" : "

③. 首次打开哪个二级路由,如果这个一级路由没有路由展示入口,可以直接在路由跳转时直接重定向到某个二级路由

使用:

④. addRouter可以动态改变路由
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
