feat: tools工具函数和自动生成路由

master
LCJ-MinYa 1 year ago
parent a75b3e674a
commit f8ac82f728

@ -1,4 +1,15 @@
const Layout = () => import('@/layout/index.vue'); const Layout = () => import('@/layout/index.vue');
import { route } from '@/utils/tools';
const titleArr = [
{
key: 'jsx',
title: '使用jsx',
},
{
key: 'tools',
title: '工具方法',
},
];
// @/views/demo/**/*.vue // @/views/demo/**/*.vue
/** /**
@ -22,10 +33,19 @@ const Layout = () => import('@/layout/index.vue');
const firstLevelComponents = import.meta.glob('@/views/demo/*.vue'); const firstLevelComponents = import.meta.glob('@/views/demo/*.vue');
const secondLevelComponents = import.meta.glob('@/views/demo/*/*.vue'); const secondLevelComponents = import.meta.glob('@/views/demo/*/*.vue');
const components = { ...firstLevelComponents, ...secondLevelComponents }; const components = { ...firstLevelComponents, ...secondLevelComponents };
console.log(components);
const demoRoutes = Object.keys(components).map((path) => { const demoRoutes = Object.keys(components).map((path) => {
console.log(path); const isHasIndex = path.includes('/index.vue');
const component = components[path]; let cptPath = path.replace(route.FILE_NAME_PREFIX, '');
cptPath = isHasIndex ? cptPath.replace('/index.vue', '') : path.replace('.vue', '');
return {
path: cptPath,
name: route.convertPathToName(cptPath),
component: components[path],
meta: {
title: route.getTitleFromPathStr(titleArr, cptPath),
},
};
}); });
export default { export default {
@ -38,15 +58,5 @@ export default {
title: '示例', title: '示例',
rank: 1, rank: 1,
}, },
children: [ children: [...demoRoutes],
{
path: '/demo/jsx',
name: 'DemoJsx',
component: () => import('@/views/demo/jsx/index.vue'),
meta: {
title: '使用jsx',
showLink: true,
},
},
],
} satisfies RouteConfigsTable; } satisfies RouteConfigsTable;

@ -16,3 +16,18 @@ export const url = {
); );
}, },
}; };
/** route路由相关工具 */
export const route = {
FILE_NAME_PREFIX: '/src/views/',
convertPathToName: (path: string): string => {
return path
.split('/') // 分割路径
.map((part) => part.charAt(0).toUpperCase() + part.slice(1)) // 首字母大写
.join(''); // 连接成字符串
},
getTitleFromPathStr: (arr: any, path: string): string => {
const item = arr.find(({ key }) => path.includes(key));
return item ? item.title : null; // 如果找到,返回 title否则返回 null
},
};

Loading…
Cancel
Save