generateAsyncRoutes/index.js

/**
* 功能：动态路由重组真实路由
* @param {array} permissionList - 请求来的规定路由数组
* @param {object} AllRoutes - 本地项目的全部路由
* @param {boolean} [children] -  是否是子路由 default is true [注：此方法在react等其他工程使用需要改变]
* @returns {array} - 重组后的路由数组，使用后还需使用router.addroutes方法重新渲染路由对象
*/
function generateAsyncRoutes(permissionList, AllRoutes, children = false) {
    const accessedRoutes = permissionList.filter((route) => {
      // 得到路由组件名称字符串
      let component = route.component;
      if (component) {
        if (component === "Layout") {
          // route.component = Layout;
        } else if (AllRoutes[component]) {
          if (!children) {
            route.path = "/" + component;
          } else {
            route.path = component;
          }
          route.component = AllRoutes[component].component;
          route.meta = AllRoutes[component].meta;
          route.props = AllRoutes[component].props;
          route.name = AllRoutes[component].name;
          route.icon = AllRoutes[component].icon;
        } else {
          return false;
        }
      }
      // 如果有子路由, 递归调用
      if (route.children && route.children.length) {
        route.children = generateAsyncRoutes(route.children, AllRoutes, true);
      }
      return true;
    });
    return accessedRoutes;
  }
  export default generateAsyncRoutes;