在前端项目中使用js的位操作符控制权限,简单易懂
给不同的角色分配不同的权限数值,权限数值只能是2的n次幂 比如 2(2的一次幂)4(2的2次幂) 8(2的3次幂)16(2的4次幂)
这样的到四个角色:
业务员1:2
业务员2:4
业务员3:8
业务员4:16
也可通过角色组合得到更多的角色:
管理员1:6(业务员1+业务员2)2+4
管理员2:10(业务员1+业务员3)2+8
管理员3:20(业务员2+业务员4)4+16
…
在页面上控制按钮
<div>
<button v-if="(userP&2|4)!=0">业务员1或业务员2的按钮</button>
<!--也可以写成:-->
<button v-if="(userP&2+4)!=0">业务员1或业务员2的按钮</button>
</div>
如果登录系统的用户的权限值为18(2+16),14(2+4+8)那么此按钮会展示
如果用户的权限值为16、8、24(8+16)那么此按钮不会展示