vue3 import 引入有变量的路径报错: Error: Unknown variable dynamic 解决方法
【代码】vue3 import 引入有变量的路径报错: Error: Unknown variable dynamic 解决方法。
·
// 这样引入携带有变量的组件可能会报错(Error:Unknown variable dynamic import)
import(`../../components/${element.src}/components-index.vue`)
.then((myModule) => {
asyncComponent.value = myModule.default
})
.catch((_err) => {
console.log('动态加载菜单失败', _err)
})
<component :is="asyncComponent" />
// 正确写法
let modules = import.meta.glob('../../components/**/**/*.vue') // 获取到所有组件的路径
const comp = modules[`../../components/${element.src}/components-index.vue`]
// comp 打印出来是个promise
comp().then((myModule) => {
asyncComponent.value = myModule.default
}).catch(() => {
})
<component :is="asyncComponent" />
// 这么写就可以正确引用出动态组件了
更多推荐
已为社区贡献1条内容
所有评论(0)