1.定义组件
<template>
<h1>{{result}}</h1>
</template>
<script>
export default {
name: "NewModel",
setup(){
return new Promise((resolve)=>{
setTimeout(()=>{
return resolve({result:"OK"})
},3000)
})
}
}
</script>
2.使用suspense渲染效果
<suspense>
<template #default>
<new-model></new-model>
</template>
<template #fallback>
<h1>Loadding...</h1>
</template>
</suspense>
结果三秒之前显示Loadding... ,三秒之后显示组件内容；（成功后显示组件内容）
3.定义异步组件
4.使用suspense渲染
<suspense>
<template #default>
<new-model></new-model>
</template>
<template #fallback>
<h1>Loadding...</h1>
</template>
</suspense>