vue3出现Error: Unknown variable dynamic import

javascript 复制代码
Unknown variable dynamic import
前端做动态路由权限

   component = () => import(`../views/${url}/${url}.vue`)
1
解决方法:

  // 首先把你需要动态路由的组件地址全部获取
   
 let modules = import.meta.glob('../views/**/*.vue')
 
 // 然后动态路由的时候这样来取
 component = modules[`../views/${url}/${url}.vue`]

自定义案例
 navigationList.forEach( navigation => {
      let modules = import.meta.glob('../views/**/*.vue')
      router.addRoute('index', {
        path: navigation.url,
        // meta: { name: navigation.name, icon: navigation.icon },
        name: navigation.name,
        component: modules[`../views${navigation.url}${navigation.url}.vue`],
      })
    })
    console.log(router.getRoutes(), '查看现有路由')
    next()
  }
相关推荐
认真的酒窝2 小时前
自己动手开发编译器(十一)语义分析
java·开发语言
Dxy12393102163 小时前
MySQL索引完整教程:创建、查看、修改、删除与日常管理
前端·javascript·mysql
wbs_scy3 小时前
Linux C++ 高并发编程:线程池全链路深度解析,从原理到手撕实现
java·开发语言
JAVA面经实录9174 小时前
Linux 常用命令完整知识体系
java·linux·开发语言·汇编
贪玩的蛋挞4 小时前
C#与闭包
开发语言·c#
端庄的战斗机4 小时前
javascript 设计模式(文章很长,请自备瓜子,水果和眼药水)
开发语言·javascript·设计模式
Full Stack Developme5 小时前
Java LRU 与 LFU 算法及应用
java·开发语言·算法
C语言小火车7 小时前
C++ 堆排序深度精讲:基于完全二叉树的选择排序进化,最坏情况 O(n log n) 的稳定王者
开发语言·c++·算法·排序算法·堆排序
北冥you鱼7 小时前
abigen 最佳实践:从入门到精通,高效生成 Go 语言合约绑定
开发语言·golang·区块链
前端毕业班7 小时前
uni-app 小程序支持 teleport 了
前端·javascript·vue.js