Vue路由的权限控制

在项目中有些页面仅能由有相应权限的用户才能查看，这时候可以给路由设置路由验证，实现权限控制功能。代码如下：

let routes=[{
    path:"/a/:id",
    component:myA,
    meta:{
    	roles:['administrator','customer']//能够通过该路由的角色
    }
},{
    path:"/b",
    component:myB,
    meta:{
    	roles:['administrator']//能够通过该路由的角色,只能由管理者通过
    }
}];
let router=new VueRouter({
   routes:routes
});
const userRole='administrator'//为了方便,这里直接用字符串代替了应从后台获取当前用户的角色名
router.beforeEach((to,from,next)=>{
	if(to.meta.roles.includes(userRole)){
		next();//通过验证
	}else{
    	//这里可以提示不能跳转等操作
    }
});