Suspense
试验性
Suspense 是一个试验性的新特性，其API可能随时会发生变动。特此声明，以便社区能够为当前的实现提供反馈。
生产环境请勿使用。
以上是官方的警告！
- 等待异步组件渲染一些额外的内容，让应用有更好的用户体验
-
<suspense>组件有两个插槽。它们都只接收一个直接子节点。default插槽里的节点会尽可能展示出来。如果不能，则展示fallback插槽里的节点。 - 这里就是之前说到setup的时候提到的，setup的返回值不能使用异步，但是如果像下面这样使用异步函数引入子组件，那么子组件就可以使用异步了，像Promise。
<template>
<div>
<Suspense>
// 这两个插槽名称是固定的
// defalut:这里面写的就是我们正常要显示的组件和代码
// fallback:这里写的就是应急代码，就是正常代码没有显示的时候的代码
<template v-slot:defalut:>
<Child/>
</template>
<template v-slot:fallback>
<div>加载中...</div>
</template>
</Suspense>
</div>
</template>
<script>
// import Child from './component/Child.vue' // 平时使用的静态引入
// 下面这是异步引入
import { defineAsyncComponent } from 'vue'
const Child = defineAsyncComponent(()=> import('./component/Child.vue'))
export default {
name: 'app',
components: {
Child
}
setup() {
}
}
</script>
