vite 动态导入页面 动态import组件
1,在做权限的时候,从后台拉路由表,然后动态引入组件,之前webpack是可以直接用的,但是vite不行,需要用特殊的方法//引入所有views下.vue文件const modules = import.meta.glob("../views/**/**.vue");/*** 解析路由表* @param routerMap 后台请求的路由表* @returns 系统路由*/export const
·
1,在做权限的时候,从后台拉路由表,然后动态引入组件,之前webpack是可以直接用的,但是vite不行,需要用特殊的方法
//引入所有views下.vue文件
const modules = import.meta.glob("../views/**/**.vue");
/**
* 解析路由表
* @param routerMap 后台请求的路由表
* @returns 系统路由
*/
export const routerFilterFunc = (routerMap: RouterItem[]) => {
const arr: RouterItem[] = [];
routerMap.forEach(item => {
const obj: RouterItem = {
...item,
beforeComponent: item.component
};
if (obj.children) {
obj.children = routerFilterFunc(obj.children);
}
if (item.component == "Layout") {
obj.component = RouterView;
} else {
const component = modules[`../views/${obj.component}.vue`] as any;
if (component) {
obj.component = modules[`../views/${obj.component}.vue`];
} else {
obj.component = () => import("@/views/404.vue");
}
}
arr.push(obj);
});
return arr;
};
这是 import.meta.glob("../views/**/**.vue")获取的内容
更多推荐
已为社区贡献23条内容
所有评论(0)