antd权限管理_Ant Design Pro开发后台管理系统（权限）-阿里云开发者社区

前言

权限是后台管理系统常见的需求，后台开发必须考虑设计的模块，antd-pro给我们提供了很好的关于权限的封装，我们只需要在配置菜单的时候配置上准入身份，在登录成功以后获取到登陆者身份以后更新登录人身份参数即可。

效果：

1、没有准入权限的菜单将不显示

2、直接在浏览器输入没有准入权限的的地址，将跳转到403页面(图1)

图1.直接输入地址但却没有权限

个人demo关于权限简介

1、用邮箱自己注册账户(注册后可以登录但是没有任何权限)guest

2、联系管理员分配权限(分配后可以查看有权限的页面)

3、每次登录后获取最新的权限身份(如：admin，user，guest)

实战

Authorized组件是antd-pro的权限组件

Authorized 官方api

在src/router.js中会发现如下代码

path="/"

render={props => }

authority={['admin', 'user', 'guest']}

redirectPath="/user/login"

/>

其中authority对象就是准入身份的数组，表示只有这些身份的人可以登录，我们在配置的时候一定不要忘记在这更新我们新增的身份

然后就是menu.js,如下，展示了我们在配置菜单的时候怎么配身份

const menuData