vue使用动态添加路由(router.addRoutes)加载权限侧边栏的方式

import Login from './views/Login.vue'
let publicRoutes = [
  {
    path: '/login',
    name: 'login',
    component: Login
  }
]

import Order from './components/orderCompontents/order.vue'
import OrderList from './components/orderCompontents/orderList.vue'
import ProductManage from './components/orderCompontents/productManage.vue'
import ProductionList from './components/orderCompontents/productionList.vue'
import ReviewManage from './components/orderCompontents/reviewManage.vue'
import ReturnGoods from './components/orderCompontents/returnGoods.vue'
const allroutes = [
  {
    path: '/order',
    title: 'order-manage',
    component: Order,
    meta: {
      name: '订单管理'
    },
    children: [
      {
        path: '/order-list',
        title: 'order-list',
        component: OrderList,
        meta: {
          name: '订单列表'
        }
      },
      {
        path: '/product',
        title: 'product-manage',
        component: ProductManage,
        meta: {
          name: '生产管理'
        },
        children: [
          {
            path: '/product-list',
            title: 'product-list',
            component: ProductionList,
            meta: {
              name: '生产列表'
            }
          },
          {
            path: '/review-manage',
            title: 'review-manage',
            component: ReviewManage,
            meta: {
              name: '审核管理'
            }
          }
        ]
      },
      {
        path: '/return-goods',
        title: 'return-goods',
        component: ReturnGoods,
        meta: {
          name: '退货管理'
        }
      }
    ]
  }
]

{
    "code": 0,
    "message": "获取权限成功",
    "data": [
        {
            "name": "订单管理",
            "children": [
                {
                    "name": "订单列表"
                },
                {
                    "name": "生产管理",
                    "children": [
                        {
                            "name": "生产列表"
                        }                     
                    ]
                },
                {
                    "name": "退货管理"
                }
            ]
        }
    ]
}

{
  "data": {
    "router": [
      {
        "path": "",
        "redirect": "/home",
      },
      {
        "path": "/home",
        "component": "Home",
        "name": "Home",
        "meta": {
          "title": "首页",
          "icon": "example"
        },
        "children": [
          {
            "path": "/xitong",
            "name": "xitong",
            "component": "xitong/xitong",
            "meta": {
              "title": "系统",
              "icon": "table"
            }
          }
        ]
      },
      {
        "path": "*",
        "redirect": "/404",
        "hidden": true
      }
    ]
  }
}

 function filterRouter(routers) {             // 遍历后台传来的路由字符串，转换为组件对象
    const accessedRouters = routers.filter(route => {
      if (route.component) {
        if (route.component === 'Home') {     // Home组件特殊处理
          route.component = Home
        } else {
          route.component = _import(route.component)
        }
      }
      if (route.children && route.children.length) {
        route.children = filterRouter(route.children)
      }
      return true
    })
    return accessedRouters
  }

function _import (file) {
    return () => import('@/components/views/' + file + '.vue')
}