vue动态路由+侧边栏菜单之动态路由
type
status
date
slug
summary
tags
category
icon
password
order
主要思路，从后台取到菜单数据，前端根据数据生成路由配置以及菜单。
后台根据前端的用户信息返回对应权限的菜单数据，省的在前端写好路由再配置权限了。
本功能使用vuex进行统一集中式的管理,这里不过多解释。
主要步骤如下：
1.从后台取对应用户权限的菜单数据
2.遍历数据，生成父路由及其子路由组件，添加到路由表中。
3.同时菜单数据也要保存到sessionStorage中，避免每次都从后台取，而且避免URL刷新空白，后面会提到。
我后台返回的菜单数据格式如下
为了添加路由时导入组件方便，我的vue组件目录结构是和菜单URL完全对应的
首先放一下我的路由配置，里面这个constantRouterMap 是固定的路由表，在没有从接口取数据生成路由时也可访问。
首先定义一个action用于从接口获取菜单数据，前面说过每次获取菜单数据时都要在sessionStorage中保存一下，避免每次都要从接口请求数据
然后还需要一个mutations是用于设置菜单及路由
接下来是上面代码中调用的这个mutations:SetRouters用于生成路由
menuToRouter用于将接口返回的数据转换为路由组件，代码如下
SetMenuTitle是因为我Tab选项卡那里的需求，所以写了一个这
还有是注意添加路由是需要加载组件的，路由中的component属性，我这里是根据菜单URL导入对应的组件,主要代码是
在router文件夹下有两个文件，分别为_import_development.js以及_import_production.js
_import_development.js
_import_production.js
还有一个最重要的，使用动态路由时，当你在首页(加载路由数据的页面)以外,刷新一下会直接变空白，这是由于子路由是动态添加的，界面刷新的时候，其实我们路由里面并没有该子路由的配置，在页面刷新时候，在router.beforeEach里面去判断，如果是页面刷新且无子路由配置，就调用获取菜单并生成路由的方法，判断条件==3是因为我的固定路由表里默认是3个
最后放下完整代码
还有getter.js中代码