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

src/router/modules/demo.ts

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

src/utils/tools.ts

@@ -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
+    },
+};