1.在routes.ts中添加菜单
{
path: '/user',
name: '用户管理',
icon: 'user',
hideChildrenInMenu: false,
routes:
[
{
path: '/user/showUsers',
name: '用户列表',
component: './User/Manage'
},
]
},
此时所有的用户登录展现的菜单效果都是这样的
接下来我们加入角色限制,
{
path: '/user',
name: '用户管理',
icon: 'user',
hideChildrenInMenu: false,
routes:
[
{
path: '/user/showUsers',
name: '用户列表',
component: './User/Manage',
access: 'canRoot' //此处限定为需要管理员角色才可见此菜单
},
]
},
在src目录下的access.ts进行修改
export default function access(initialState: { currentUser?: API.LoginUserVO } | undefined) {
const { currentUser } = initialState ?? {};
return {
canRoot: currentUser && currentUser.userRole === 'root' ? true : false,//返回true 展示
};
}
管理员角色登录菜单效果:
普通用户角色登录菜单效果: