findjh | 找到我啦!

动态路由怎么做？
路由分成两部分：一部分是无权限的，比如登录，注册页。另一部分是有权限的，比如个人中心、订单。
有权限的路由数组routeList定义在前端，会被打包，然后在router.beforeEach钩子判断vuex有没有调用过路由接口，拿到了路由权限。如果有就直接next(),没有就要调用路由权限接口，放到vuex里，之后根据权限将routeList递归筛选出来，使用addRoutes方法添加进路由表。

let routeList = [
    {
        name: '订单',
        path: 'order',
        auth: 'order',
        children: [
            {
                name: '订单详情',
                path: 'order-detail',
                auth: 'order-detail',
            },
            {
                name: '订单列表',
                path: 'order-list',
                auth: 'order-list'
            }
        ]
    },
    {
        name: '个人中心',
        path: 'personal',
        children: [
            {
                name: '简介',
                path: 'profile',
                auth: 'profile'
            }
        ]
    },
    {
        name: '购物车',
        path: 'cart',
        auth: 'cart'
    }
]
// 
const authList = [ 'order', 'order-detail']
// 根据auth获取到新的路由表,规则如果auth 数组有path，就展示。
const getRouteList = (routeList, authList) => {
    return routeList.filter(route => {
        if (authList.includes(route.auth)) {
            if(route.children){
                route.children = getRouteList(route.children,authList)
            }
            return true;
        }
    });
}
const res = getRouteList(routeList, authList);
console.log(res);