前端开发经常遇到异步的问题,请求函数,链接库,等,都有可能需要通过promise或者async await 来进行异步的一个封装。
异步组件也由此诞生,我用settimeout来模拟一个vue3的异步组件
{{ someData }}
This is an about page
页面会有警告,而且组件渲染也失败了,解析了警告的意思,是说这种异步组件需要一个Suspense来包裹一下
Suspense 是vue3新增的一个内置组件,专门用来处理异步组件的。
This is an about page
请稍等
Suspense的原理是通过插槽来实现的,一个default和一个fallback。
default里面放置异步组件,fallback里面就放置异步组件未渲染之前的一个样式
有人说vue3中setup不能是异步函数,上面的代码证明,setup可以是异步函数,他们可能不了解Suspense这个内置组件。
{{ someData }}
This is an about page
请稍等
最后总结一下,只要将异步组件放在suspense的default插槽中即可。
上一篇:在写生的营地里
下一篇:Mysql实战调优拾遗三