vue实现权限管理有感。

新手记录一下一个使用vue实现简单权限管理的方法,我们先假设

1:数字1代表管理员权限,
2:数字2则代表普通用户权限;
有了这些那么下面简单实现菜单及按钮级别的管理。

前端发送登陆数据,后端验证并返回token和权限等相关信息。
将信息保存至sessionStorage中
在这里插入图片描述

登陆成功后跳转到菜单的管理页面,那么这里就开始使用权限管理了,一些菜单是只有管理员才能看到,那么我们就该菜单中使用v-if,(这里是elmentui)
在这里插入图片描述
等于1就显示该菜单,不是1就不显示,不过需要使用creater()方法在页面加载前,读取user里面的信息。
在这里插入图片描述
同理,在按钮处同样使用v-if
在这里插入图片描述
ok,那么前端处理权限的简单方式就这样。大多很多情况是使用vuex来存取这些数据的,原理如此,换个存取方式罢了。
下次学习以下后端的权限管理方式

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值