动态路由渲染（思路）

什么是动态路由

        在我们进行登录逻辑时会由于不同的身份信息，给定不同的身份权限（这个身份权限是确定的，权限信息一般存放于数据库）将用户信息提交给后端会得到返回结果叫做身份权限认定（一般是由后端完成，前端也是可以完成的），根据用户的权限进行数据的列表渲染叫做动态路由

动态路由分为那种实现方式

后端+前端

后端返回权限路由表数据，前端只有基础路由表数据

通过全局路由守卫，以及 addroute  完成动态添加路由信息

let hasMenus = false //判断是否添加过路由
router.beforeEach((to, from, next) => {
 	//to: Route: 即将要进入的目标 路由对象

	//from: Route: 当前导航正要离开的路由

	//next: Function: 一定要调用该方法来 resolve 这个钩子。
                        //执行效果依赖 next 方法的调用参数。
	if (hasMenus) {
	//如果有路由，向下执行
   	 next()
  	} else {
  		//如果没有，添加动态路由
    	trendsRouter.forEach(ele => {
      		router.addRoute(ele)
    	});
    	hasMenus = true
    	next({ ...to, replace: true })
  }
})

前端完成（数据、渲染）

（写死路由表一般在一个前端js文件中，身份权限的认定是后端完成的）

前端路由表写死，通过对数据过滤处理得到相应的权限路由表（数据方面）

        前端只需要进行匹配身份信息，通过不同的函数，对已有写死路由表的处理得到需要渲染的权限路由表将其渲染即可。（该步骤也在路由守卫中完成）

前端路由表写死，通过按钮级别的渲染控制，完成动态路由（渲染方面）

        前端进行渲染数据的时候是将数据挂载在页面dom上完成，如果已有数据但是没有dom，是不会进行数据展示的、也就衍生出了该方法。

        对不同身份权限的每个节点进行一个状态信息的存储。（一般我们存在VueX中），依照dom的状态对其节点进行一个渲染与否的判断，即可完成对动态路由按钮级别的控制。