如何用Vue实现前端权限控制的小例子？

本文共计1508个文字，预计阅读时间需要7分钟。

简单说明：最近写了一个Vue控制权限（菜单、路由）的项目，用到了Vuex、addRoutes动态添加路由等方法，总共100多行代码，跟大佬分享一下~ 逻辑处理+除登录接口、退出接口外，其他接口增加权限控制。

简要说明

最近写了一下vue控制权限(菜单、路由)的项目，用了vuex、addRoutes动态添加路由方法等，总共100多行代码，跟大家分享一下~

逻辑梳理

• 除登录接口、退出接口外，其余接口增加token验证。
• 打开页面时请求获取菜单接口，请求不成功说明未登录，给route默认添加login页面以及 * 重定向。
• 登录成功后获取到token，把token存入session以及请求头。
• 登录成功后获取菜单接口，请求回来的路由和vuex里面全部的路由进行匹配，获取component。
• 把获取完component的路由格式化，找自己的parentId，如果找到的话插入到该元素的child里面。