vue前台控制账户权限,菜单权限

新手小白,之前从未做过类似的权限功能。

首先说明一点,就是从我百度的经验以及从身边人了解的知道,做权限控制最好是后台返回菜单数据,然后前台渲染。而所谓的前台控制权限是不存在的,只不过是,前台控制显示而已,有待深入了解。

一开始我是蒙圈的,百度了好过都说需要前台配置然后调用接口,后台返回菜单数据,最后进行渲染。但我始终不明白这中间如何操作才能让后台返回菜单数据。

但因为我的合作伙伴,后端同事说不使用这个方法,他说其实不管我前台传给后台什么数据,他都不会完全信任的,所以,他在后台也是做了权限的(比如某个账户不能调用某个接口)。不使用这个办法,那就好办咯。以下是自己想出来的解决办法,解决不同身份的账号登录进去动态显示不同的菜单。

系统账户目前分为三种:管理员,技术员和生产员,而区分他们身份的是在登录成功后后台返回给我的一个classType值,值为0,则是管理员,值为1,则是技术员,值为2,则是生产员。

大致思路是:分别根据不同身份写三个不同的js文件,其中js文件中是包含不同菜单的一个json对象,然后在index中分别导入这三个文件,在vue实例创建的时候(也就是created方法中)在缓存中取出已经在登录后拿到的classType值,根据不同的值选择合适的数据进行渲染菜单。

index.vue文件:

猜你喜欢

转载自blog.csdn.net/qq_41588568/article/details/103183937