使用vue cli3.x创建项目,登录之后,使用router.addRoutes(routers)方法动态添加后端传过来的权限配置文件时,如何处理组件的加载?
因为后台传过来的component是一个字符串,例如:
{
path:"/home",
name:"home",
meta: {title: 'xxx},
component:"./views/page/home"
}
而我们需要的是:
{
path: '/home',
name: 'home',
meta: {title: 'xxx},
component: () => import('./views/page/home')
},
最简单的处理方式是:
let component = () => import('@/views/'+`${path}`)
因为import里面直接写变量会报错,所以需要使用模板字符串的方法,另外需要将'@/views/'写成固定的,直接写${path}
或者@/${path}
,webpack都有可能无法识别,所以后端的配置文件,component数据可以直接传@/views/之后的路径