将后端传回的“component“: “Layout“, 转为“component“: Layout组件对象

需要将 () => import('@/views/dashboard/index.vue') 修改为  () =>  require('@/views/' + file + '.vue')

将后端传回的“component“: “Layout“, 转为“component“: Layout组件对象_第1张图片

1、_import_development.ts文件内内容

将后端传回的“component“: “Layout“, 转为“component“: Layout组件对象_第2张图片

module.exports = (file:any) => require('@/views/' + file + '.vue').default  

2、showdataAPI.ts 后台返回数据格式

将后端传回的“component“: “Layout“, 转为“component“: Layout组件对象_第3张图片

3、router/index.ts 重写路由 

  这里两种方法都可以(loadView、_import)

将后端传回的“component“: “Layout“, 转为“component“: Layout组件对象_第4张图片

 

const _import = require('@/router/_import_development') //获取组件的方法

const loadView = (file: any) => {

  return require('@/views/' + file + '.vue')

}

//重写  component

export const initMenu = (menu: any) => {

  menu.forEach((el: any) => {

    if (el.componenturl === 'Layout') {

      el.component = Layout

    } else {

      // el.component = loadView(el.componenturl)

      el.component = _import(el.componenturl)

    }

    if (el.children != null && el.children.length) {

      initMenu(el.children)

    }

  })

  return menu

}

你可能感兴趣的:(import,component,Layout,路由)