vue-element-admin 后台管理系统项目总结（2）思维导图

import router from '@/router'
import Layout from '@/layout'
import { resetRouter, constantRoutes } from '@/router'
import { Loading } from 'element-ui'

class AddRoute {
  checkRoute () {
    return new Promise((resolve, reject) => {
      if (router.options.routes.length <= 7) {
        resolve()
      } else {
        resetRouter()
        resolve()
      }
    })
  }

  loadView (view) {
    return (resolve) => require([`@/views${view}`], resolve)
  }

  initRoute (that, $api) {
    return new Promise(async (resolve, reject) => {
      const loadingInstance = Loading.service({ fullscreen: true, lock: true, text: '正在加载中...' });
      await this.checkRoute().then(async () => {
        try {
          const res = await $api.getIndexMenu({}, { showLoading: false })
          const arr = []
          res.menu.forEach(item => {
            if (item.path_json) {
              arr.push(JSON.parse(item.path_json))
            }
          })
          
          const list = []
          const concatRoute = (routes, list) => {
            Array.prototype.forEach.call(routes || [], (item, index) => {
              // console.log(item)
              list.push(Object.assign({}, item, {
                component: item.component == 'Layout' ? Layout : this.loadView(item.component)
              }, item.children && item.children.length ? { children: [] } : {}))
              if (item.children && item.children.length) {
                concatRoute(item.children, list[index].children)
              }
            })
          }
          concatRoute(arr, list)
  
          router.addRoutes(list)
          router.options.routes = [...constantRoutes , ...list]
          
          // console.log(router)
  
          await that.$main.$emit('initRoute')
  
          loadingInstance.close()
          resolve(list)
        } catch (e) { 
          loadingInstance.close()
          reject(e)
        }
      })
    })
  }
}

export default new AddRoute()