🔥🔥🔥完善路由后端渲染方案，弃用之前写法

src/store/modules/routes.js

@@ -4,7 +4,7 @@
  */
  */
 import { asyncRoutes, constantRoutes } from "@/router";
 import { asyncRoutes, constantRoutes } from "@/router";
 import { getRouterList } from "@/api/router";
 import { getRouterList } from "@/api/router";
-import { filterAllRoutes, filterAsyncRoutes } from "@/utils/handleRoutes";
+import { convertRouter, filterAsyncRoutes } from "@/utils/handleRoutes";
 
 
 const state = { routes: [], partialRoutes: [] };
 const state = { routes: [], partialRoutes: [] };
 const getters = {
 const getters = {
@@ -35,7 +35,7 @@ const actions = {
   async setAllRoutes({ commit }) {
   async setAllRoutes({ commit }) {
     let { data } = await getRouterList();
     let { data } = await getRouterList();
     data.push({ path: "*", redirect: "/404", hidden: true });
     data.push({ path: "*", redirect: "/404", hidden: true });
-    let accessRoutes = filterAllRoutes(data);
+    let accessRoutes = convertRouter(data);
     commit("setAllRoutes", accessRoutes);
     commit("setAllRoutes", accessRoutes);
     return accessRoutes;
     return accessRoutes;
   },
   },

src/utils/handleRoutes.js

@@ -4,8 +4,8 @@
  * @param constantRoutes
  * @param constantRoutes
  * @returns {*}
  * @returns {*}
  */
  */
-export function filterAllRoutes(constantRoutes) {
-  return constantRoutes.filter((route) => {
+export function convertRouter(asyncRoutes) {
+  return asyncRoutes.map((route) => {
     if (route.component) {
     if (route.component) {
       if (route.component === "Layout") {
       if (route.component === "Layout") {
         route.component = (resolve) => require(["@/layouts"], resolve);
         route.component = (resolve) => require(["@/layouts"], resolve);
@@ -13,29 +13,16 @@ export function filterAllRoutes(constantRoutes) {
         route.component = (resolve) =>
         route.component = (resolve) =>
           require(["@/layouts/EmptyLayout"], resolve);
           require(["@/layouts/EmptyLayout"], resolve);
       } else {
       } else {
-        let path = "views/" + route.component;
-        if (
-          new RegExp("^/views/.*$").test(route.component) ||
-          new RegExp("^views/.*$").test(route.component)
-        ) {
-          path = route.component;
-        } else if (new RegExp("^/.*$").test(route.component)) {
-          path = "views" + route.component;
-        } else if (new RegExp("^@views/.*$").test(route.component)) {
-          path = route.component.slice(1);
-        } else {
-          path = "views/" + route.component;
-        }
+        const index = route.component.indexOf("views");
+        const path =
+          index > 0 ? route.component.slice(index) : `views/${route.component}`;
         route.component = (resolve) => require([`@/${path}`], resolve);
         route.component = (resolve) => require([`@/${path}`], resolve);
       }
       }
     }
     }
-    if (route.children && route.children.length) {
-      route.children = filterAllRoutes(route.children);
-    }
-    if (route.children && route.children.length === 0) {
-      delete route.children;
-    }
-    return true;
+    if (route.children && route.children.length)
+      route.children = convertRouter(route.children);
+    if (route.children && route.children.length === 0) delete route.children;
+    return route;
   });
   });
 }
 }