基本用法
在大型项目中，我们可能需要拆分应用为更小的块，并仅在需要时再从服务器加载相关组件，就需要使用defineAsyncComponent这个API。也就是说当我们需要用到这个组件的时候才回去加载它。
<template>
<AdminPage />
</template>
<script setup>
import { defineAsyncComponent } from 'vue'
const AdminPage = defineAsyncComponent(() =>
import('./components/AdminPageComponent.vue')
)
</script>
加载与错误状态
const AsyncComp = defineAsyncComponent({
// 加载函数
loader: () => import('./Foo.vue'),
// 加载异步组件时使用的组件
loadingComponent: LoadingComponent,
// 展示加载组件前的延迟时间，默认为 200ms
delay: 200,
// 加载失败后展示的组件
errorComponent: ErrorComponent,
// 如果提供了一个 timeout 时间限制，并超时了
// 也会显示这里配置的报错组件，默认值是：Infinity
timeout: 3000
})
