react 使用@loadable/component 实现路由动态懒加载
/**
* 根据已经获取的菜单组合需要生成的路由
* @param list 数据
* @param parentPath 父级的路径，组合子级可访问路径
*/
const combinationRouting = (list: Menus[], parentPath?: string) => {
let portMenu: PortfolioMenuType[] = [];
list.forEach((item: Menus) => {
const path = parentPath ? parentPath + item.url : item.url;
const obj: PortfolioMenuType = {
path,
component: () => import(`../pages${path}/index`),
name: item.id,
};
// 是否存在子级
if (item.children && item.children.length > 0) {
const result: PortfolioMenuType[] = combinationRouting(item.children, item.url);
portMenu = portMenu.concat(result);
}
if (!parentPath) {
portMenu.push(obj);
}
});
return portMenu;
}
export { combinationRouting }