我正在创建一个延迟加载的组件.我的问题是关于JavaScript本身,而不是任何特定的框架(Reaction、Svelte等),所以我给出了一些伪代码.
const myLazyLoadedComponent() {
let myComponent
let isLoading = true
import('/some/path.xx').then(c => {
myComponent = c
isLoading = false
})
//this part is reactive with the variables above:
return (
if (isLoading) <div>Loading..<div/>
else <myComponent/>
)
}
这将在第一次很好地发挥作用.但当我关闭-重新打开或打开它的另一个实例时,Loading..
会在myComponent之前显示一微秒.
Is there a way to first check if the module was already imported, and based on that, either use it directly or async import()?个
大概是这样的:
if (isAlreadyImported('/some/path.xx').) {
import { myComponent } from '/some/path.xx'
} else {
isLoading = true
import('/some/path.xx').then(c => {
myComponent = c
isLoading = false
})
}