vue权限管理和使用addRoutes动态加载路由

本篇讲述关于vue项目中权限管理和addRoutes动态加载路由问题

项目中需要新增一个根据不同角色，设置不同权限，根据具体权限访问不同菜单的功能。

首先分析项目需求：

1. 需要有不同的角色，角色拥有不同的权限
2. 根据权限访问菜单，那么路由需要进行动态的添加
3. 那么路由初始化时应该是只有那些不需要权限就访问的页面，比如登录注册这种。

再来思考如何实现功能，方案大致有两种：
4. 一是静态注册好所有的路由，在登录后根据登录的角色所拥有的权限去一个个对比，控制哪些页面进行隐藏和显示，这种方法实现的逻辑通俗易懂，便于理解，但仅适用于微小型项目使用，如果项目中页面有几十个，不建议使用这种方案。
5. 二是初始化路由时只注册登录、注册这种不需要权限就可以访问的路由，在登录时请求接口更根据后台返回的菜单进行处理后动态添加到路由中

我这里选择第二种方式使用addRoutes进行动态路由添加，因为我的项目页面有几十个，不太适合用第一种。

1. 首先注册不需要权限的就能访问的路由
   
2. 请求后台的返回的权限菜单，并将菜单数据进行处理，格式保持与我们的静态路由一致才