很多小伙伴都好奇微人事中的动态菜单是怎么实现的?这个问题其实松哥之前和大家聊过,有两种不同的思路:
- 前后端分离开发中动态菜单的两种实现方案
在微人事中,松哥从后端来控制了 Vue 菜单的动态加载,整体上的思路就是根据用户的登录信息,查询该用户可以操作的菜单,然后将可以操作的菜单数组返回到前端,前端再将菜单数组渲染出来,这样就可以看到不同用户登录看到不同菜单的效果了。
今天我们从一个较小的角度切入,先来和小伙伴们聊一聊如何使用 Vue ElementUI 构建微人事的左边菜单。
好了,我们就直接来看视频吧(本视频节选自松哥自制的微人事视频教程第 39 集)。
不知道小伙伴们有没有看懂呢?其实 Vue ElementUI 可以算是非常流行的前端框架组合了,足以应付大部分常规的企业级开发。在这个视频教程的基础上,我们只需要根据当前登录的用户 id,查询出该用户可以操作的菜单,再替换下 router 中的数组就可以了,是不是豁然开朗呢?
好了,关于这个视频,有问题欢迎留言,公众号后台回复 vhr 可以查看本套视频完整信息