defineAsyncComponent封装的函数有@符号导入不成功,有代码,帮解决?-灵析社区

金刚老六

![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241008/dca5e0ccaad65929c2d27a84669d4726.png) import {defineAsyncComponent} from "vue"; import Loading from "@/components/Loading.vue"; import ErrorComponent from "@/components/ErrorComponent.vue"; const async_import = (path) => defineAsyncComponent({ loader: () => import(path), delay: 0, timeout: 500000, errorComponent: ErrorComponent, loadingComponent: Loading }) // 有@符号就不行,这种写法就不行 export const Test = async_import("@/components/Test001.vue") export const Test1 = async_import("./components/Test001.vue")

阅读量:193

点赞量:0

问AI
因为你defineAsyncComponent中的import使用的是纯变量,这样不行,需要加入一点字符串,然后关键位置使用变量传入,比如"@/components/${path}",这样编译时会编译所有./components下的组件,但运行时确定path值后才会加载对应组件。具体原因参考 "https://segmentfault.com/q/1010000040994050" (https://segmentfault.com/q/1010000040994050)