模拟根据后端返回列表数据，先包装成树结构，包装路由数据格式。

1.后端接口返回的数据格式

 dataList: [
        { id: 2, pid: 0, path: "/course", name: "Course", title: "课程4管理" },
        {
          id: 3,
          pid: 2,
          path: "course",
          name: "Course1",
          title: "课程4管理",
          link: "/course/c22"
        },
        { id: 5, pid: 2, path: "/course", name: "Course", title: "课程33管理" },
        {
          id: 6,
          pid: 0,
          path: "/student",
          name: "Course1",
          title: "xues管理",
          link: "/course/c3"
        },
        {
          id: 7,
          pid: 6,
          path: "operate",
          name: "Course333",
          title: "课1程管理"
        },
        {
          id: 8,
          pid: 6,
          path: "add",
          name: "Course1",
          title: "课程23管理",
          link: "/course/c12"
        }
      ]

2.先包装成树，再包装成路由格式。

    function returnTree(data) {
      let parents = data.filter(item => item.pid === 0),
        children = data.filter(item => item.pid !== 0);
      toTree(parents, children);
      function toTree(parents, children) {
        parents.map(p => {
          children.map((c, i) => {
            if (c.pid === p.id) {
              let _c = JSON.parse(JSON.stringify(children));
              _c.splice(i, 1);
              toTree([c], _c);
              if (p.children) {
                p.children.push(c);
              } else {
                p.children = [c];
              }
            }
          });
        });
      }
      return parents;
    }
    
    let treeList = returnTree(this.dataList);
    
    function generateRouter(data) {
      let newRoutes = data.map(r => {
        let routes = {
          path: r.path,
          name: r.name,
          component: () => import(`@/views/${r.name}`)
        };
        if (r.children) {
          routes.children = generateRouter(r.children);
        }
        return routes;
      });
      return newRoutes;
    }

    let userRoutes = generateRouter(treeList);
    
    console.log(userRoutes)
    

3.补充说明或总结

1. 如果后端直接返回的菜单已经是树结构，以上代码可只取包装路由的部分。
2. 以上代码定义的变量，方法，参数，根据自己代码修改。
3. 源数据只要知道id和pid关系（父子关系），就能包装成树形。
4. 可以学习递归用法，也可以是vue项目，动态菜单-动态路由的某个环节。