qq_26566145 2022-12-09 10:43 采纳率: 0%
浏览 55
已结题

vue3+ts+pinia的权限管理如何实现?

img


只给用户管理添加了roles
登录以后调用pinia的方法


setUser(user: UserModel) {
  const routers = markRaw(layoutMap);
  let roles:string = user.roles?.length === 1 ? user.roles[0].name : ''
  const accessedRouters = filterAsyncRouter(routers, roles);
  this.users = user
  this.routers = accessedRouters;
  handleFixedVisitedViews(tagsStore(), routers);
},

这个是filterAsyncRouter的方法

import router from "./../router/index";
import { _RouteRecordBase } from "vue-router";
//处理权限
export const hasPermission = (route: any, role: any) => {
  if (route.meta && route.meta.roles) {
    return route.meta.roles.includes(role);
  }
  //默认不设置权限
  return true;
};
// 菜单权限处理
export const filterAsyncRouter = (routerMap: any, roles: any) => {
  console.log(roles);
  const accessedRouters = routerMap.filter((route: any) => {
    if (hasPermission(route, roles)) {
      if (route.children && route.children.length) {
        route.children = filterAsyncRouter(route.children, roles);
      }
      return true;
    }
    return false;
  });
  return accessedRouters;
};

后端返回的数据结构是这样的

img


其中roles如果是普通用户返回的是roles:[]
现在的问题是我登录admin用户

img


出现这样的结果
登录普通用户的时候用户管理不出来这个,这个没有问题
怎么解决登录admin用户的时候用户列表404的问题

  • 写回答

0条回答 默认 最新

    报告相同问题?

    问题事件

    • 系统已结题 12月17日
    • 创建了问题 12月9日