因此,下文我会和大家分享两种方式实现动态菜单,这两种方式仅仅只是探讨如何更好的给用户展示菜单,而不是探讨权限管理,因为权限管理是在后端完成的,也必须在后端完成。
一旦建立起这样的思考框架,你会发现动态菜单的实现办法太多了。
动态菜单就是用户登录之后看到的菜单,不用角色的用户登录成功之后,会看到不用的菜单项,这个动态菜单要怎么实现呢?整体来说,有两种不同的方案,松哥曾经做过的项目中,两种方案也都有用过,这里分别来和大家分享一下。
2.1 后端动态返回
后端动态返回,这是我在微人事中采用的方案。微人事中,权限管理相关的表一共有五张表,如下:
其中 hr
表就是用户表,用户登录成功之后,可以查询到用户的角色,再根据用户角色去查询出来用户可以操作的菜单(资源),然后把这些可以操作的资源,组织成一个 JSON 数据,返回给前端,前端再根据这个 JSON 渲染出相应的菜单。以微人事为例,我们返回的 JSON 数据格式如下:
[
{
“id”:2,
“path”:“/home”,
“component”:“Home”,
“name”:“员工资料”,