项目微调

优化封装的路由菜单

frontend/src/routers/index.ts

@@ -32,7 +32,9 @@ const routerMode = {
 const router = createRouter({
   history: routerMode[mode](),
   routes: [...staticRouter, ...errorRouter],
+  // 不区分路由大小写，非严格模式下提供了更宽松的路径匹配
   strict: false,
+  // 页面刷新时，滚动条位置还原
   scrollBehavior: () => ({ left: 0, top: 0 })
 });
 

frontend/src/routers/modules/staticRouter.ts

@@ -1,6 +1,6 @@
 import { RouteRecordRaw } from "vue-router";
 import { HOME_URL, LOGIN_URL } from "@/config";
-
+export const Layout = () => import('@/layouts/index.vue');
 /**
  * staticRouter (静态路由)
  */
@@ -20,9 +20,7 @@ export const staticRouter: RouteRecordRaw[] = [
   {
     path: "/layout",
     name: "layout",
-    component: () => import("@/layouts/index.vue"),
-    // component: () => import("@/layouts/indexAsync.vue"),
-    // redirect: HOME_URL,
+    component: Layout,
     children: [
       {
         path: "/plan",
@@ -54,32 +52,39 @@ export const staticRouter: RouteRecordRaw[] = [
  */
 export const errorRouter = [
   {
-    path: "/403",
-    name: "403",
-    component: () => import("@/components/ErrorMessage/403.vue"),
-    meta: {
-      title: "403页面",
-    },
-  },
-  {
-    path: "/404",
-    name: "404",
-    component: () => import("@/components/ErrorMessage/404.vue"),
-    meta: {
-      title: "404页面",
-    },
-  },
-  {
-    path: "/500",
-    name: "500",
-    component: () => import("@/components/ErrorMessage/500.vue"),
-    meta: {
-      title: "500页面",
-    },
-  },
-  // Resolve refresh page, route warnings
-  {
-    path: "/:pathMatch(.*)*",
-    component: () => import("@/components/ErrorMessage/404.vue"),
+    path: "/layout",
+    name: "layout",
+    component: Layout,
+    children: [
+      {
+        path: "/403",
+        name: "403",
+        component: () => import("@/components/ErrorMessage/403.vue"),
+        meta: {
+          title: "403页面",
+        },
+      },
+      {
+        path: "/404",
+        name: "404",
+        component: () => import("@/components/ErrorMessage/404.vue"),
+        meta: {
+          title: "404页面",
+        },
+      },
+      {
+        path: "/500",
+        name: "500",
+        component: () => import("@/components/ErrorMessage/500.vue"),
+        meta: {
+          title: "500页面",
+        },
+      },
+      // Resolve refresh page, route warnings
+      {
+        path: "/:pathMatch(.*)*",
+        component: () => import("@/components/ErrorMessage/404.vue"),
+      },
+    ],
   },
 ];