jihe-hs/ruoyi-ui/src/router/routerCreater.js

import Vue from "vue";
import Router from "vue-router";
import compX from "@/views/JiHeExpressway/components/compX.vue";

Vue.use(Router);

/* Layout */
// import Layout from "@/layout";
import menuData from "@/common/menuData";
// 公共路由

import {constantRoutes} from "./index.js";

let ids = [];  //层级id列表，每级菜单记录一个id，供菜单回显使用
let prev = ""; //前缀，用来区分左右侧菜单
let level = 0; //当前正在处理的菜单层级
let deltaLvl = 1; //已递归进入的菜单层级，用于编辑完当前菜单后返回时使用
let counter = {} //记录左右侧菜单的下一个可用索引
function processNode(node) {
  
  let arr = [];
  node.forEach((item, index) => {

    if(level == 0 ){  //处理顶级菜单，加前缀、按照前缀分别计算下一个可用索引记录到counter中
      prev = item.position.substring(0, 1); //取到前缀
      counter[prev] == undefined ? counter[prev] = 0 : "";
      ids = [counter[prev]];
      counter[prev] ++;
    }else{
      ids[level] = index;  //如果不是顶级菜单，直接将“下一个可用索引”存到ids列表里
    }

    let temp = {
      path: item.path || "",
      title: item.title,
      name: item.name,
      meta: { menuId : prev + "_" + ids.join("-"), title : item.title}
    };

    if (item.redirect) {
      temp.redirect = {
        name: item.redirect,
      };
    }
    if (!item.component) {
      temp.component = compX;
    } else {
      temp.component = (resolve) =>
        require(["@/views/JiHeExpressway/pages/" + item.component], resolve); //views/visualization/pages/${item.component}
    }

    if (item.children && item.children.length > 0) {
      level ++;
      if (index == (node.length - 1)){  //处理最后一项菜单还有children、无法返回上一层的情况
        deltaLvl ++;        //记录的是“最后一项有children”的层级的累计数量
      }
      temp.children = processNode(item.children);
    } else if (index == (node.length - 1)) {  //当前层级已处理到最后一项、且最后一项无children时返回
      level -= deltaLvl;
      ids.splice(deltaLvl*-1, deltaLvl); //返回后，摘出ids里对应数量的层级数
      deltaLvl = 1
    }
    arr.push(temp);
  });
  return arr;
}

let childrenRoutes = processNode(menuData);
let routes = [
  {
    path: "/index",
    name: "index",
    redirect:{
      path:"/home"
    },
    component: () => import("@/views/JiHeExpressway/index"),
    // children: childrenRoutes
    children: childrenRoutes,
  },
  {
    path: "/",
    name: "root",
    redirect:{
      path:"/home"
    }
  },
  ...constantRoutes
];
export default new Router({
  base: "/",
  // mode: 'hash', // 去掉url中的#
  mode: "history", // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: routes,
});