持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第4天,点击查看活动详情
流程
引言
通过之前一段时间 Express 和 Mysql 的学习
这里尝试来搭建一个 后台系统 来巩固下学习的技术。
流程
上一节,我们能成功的 展示了 当前用户 对应的 菜单,即 动态菜单
这一节,我们将现在的项目流程再梳理一遍。进行查缺补漏。
登录流程
首先是 登录流程
在登陆成功后,我们能够获取到 当前用户的一个信息,包括 用户的id,用户的 角色id。
之后根据 当前用户的 角色id 获取到所拥有的 对应的 菜单id 列表。
此时我们会再请求一个新的接口,这个接口的作用就是来,获取到 这个项目所有的 菜单信息 以及 相关的按钮 权限信息
之后我们会进行 循环 这个 菜单信息,然后判断 每个菜单的id 是否是在 这个用户所拥有的 菜单id列表 当中
-
如果存在,那么就将路由当中的
meta的hidden属性,改变为false -
不存在的话,则
meta的hidden属性,改变为true
为什么要这么做呢,是因为在这个步骤之后,接下来后续我们会进行 动态路由 的处理
来真正的展示当前用户信息。
问题
通过上面的分析,可以看到 表面的流程 是很完美的,好像挑不出什么毛病
但是其实在你处理好了之后,你就会发现一个问题,
我们的侧边栏菜单,显示就会出现毛病
可以看到,我们的 系统管理 下边的 菜单管理 的右侧,怎么会多出一个层级呢?
没错,我们当时给 菜单管理 添加了 按钮权限,所导致的,菜单会多了一个层级。
下一节,我们将把这个 bug 进行处理。
总结
通过 Express-Mysql-Vue3-TS-Pinia 做出一个 后台系统 项目
这一节,主要是分析 当前项目 流程 信息,来发现一些问题。