Ant Design Pro权限管理

极客猿导航后台现在需要有两种权限,一种是管理员,一种是普通用户。

管理员可以管理导航,分类,标签等;普通用户可以自定义导航,生成一个专属于用户的导航页面,用户可以自己添加分类和导航,也可以选择从主站添加。

权限问题

我们采用现成的解决方案,使用 ant design pro 的权限管理,具体的配置步骤如下:

  1. scr/access.ts 文件中定义权限,如:
export default function (initialState) {

  return {

    canAdmin: true,

    canUser: () => true,

  };

}

initialState 是全局数据,是你应用登录或者初始化时请求用户的数据,里面包含的用户的权限。

  1. 配置路由权限,在路由配置文件中添加权限属性
// config/config.ts

import { defineConfig } from 'umi';

export default defineConfig({

  routes: [

    {

      path: '/foo',

      name: 'foo',

      // ...

      access: 'canUser', 

    },

    {

      path: '/admin',

      name: 'admin',

      // ...

      access: 'canAdmin',

    },

  ],

  // ...

});

用户没有权限的路由将不会显示在菜单里。

  1. 调试 login 页面的接口,检查initialState 是否赋值正确

本文系作者 @ 原创发布在 极客猿小兵的博客。未经许可,禁止转载。


极客猿小兵 » Ant Design Pro权限管理

发表评论