vue3 异步组件
创始人
2024-01-17 16:28:09
0次

前端开发经常遇到异步的问题，请求函数，链接库，等，都有可能需要通过promise或者async await 来进行异步的一个封装。

异步组件也由此诞生，我用settimeout来模拟一个vue3的异步组件

异步的子组件

按照正常组件使用

页面会有警告，而且组件渲染也失败了，解析了警告的意思，是说这种异步组件需要一个Suspense来包裹一下
在这里插入图片描述
Suspense 是vue3新增的一个内置组件，专门用来处理异步组件的。

异步组件的正确使用方式

Suspense的原理是通过插槽来实现的，一个default和一个fallback。
default里面放置异步组件，fallback里面就放置异步组件未渲染之前的一个样式

有人说vue3中setup不能是异步函数，上面的代码证明，setup可以是异步函数，他们可能不了解Suspense这个内置组件。

async await 的setup函数

父组件通过Suspense使用异步的子组件

最后总结一下，只要将异步组件放在suspense的default插槽中即可。

上一篇：在写生的营地里

下一篇：Mysql实战调优拾遗三

相关内容

热门资讯

大数据技术之Hive 第1章 Hive入门1.1 什么是Hive1）Hive简介Hive是由Facebook...
设备修缮类合同范本共18篇 设备修缮类合同范本 第一篇甲方：乙方：甲、乙双方就甲方委托乙方对甲方的机械设备进行维修事宜，经协商一...
婚前签下协议书范文(优选20... 婚前签下协议书范文 第一篇甲乙双方经自由恋爱，双方准备结婚，都愿共筑爱巢，白头到老，但为防止今后可能...
苗木买卖合同范本推荐19篇 苗木买卖合同范本 第一篇供方：______________需方：______________一、品种...
个人租房合同书样本 个人租房合同书样本出租方（甲方）：xxx，男/女，xxxx年xx月xx日出生，身份证号码xxxxxx...
pandas学习（二）数据的引... 数据的引用 语法说明df[label]指定DataFrame对象的列标签并选择列df[[label1...
有哪些好看颜值高的蓝牙耳机？高... 我们在选购的时候不仅仅看看参数，还要看颜值，小巧轻便，时尚...
台州出租塔吊合同范本共11篇 台州出租塔吊合同范本 第一篇出租方（甲方）：_________承租方（乙方）：_________甲、...
财务人员用工合同范本5篇 财务人员用工合同范本 第一篇近来,财务人员成了职业倦怠的高发人群。那么签订财务人员劳动合同需要注意什...
华为OD机试用Python实现... 华为OD机试题 本篇题目：明明的随机数题目输入描述输出描述：示例 1输入输出说明 代码编写思路 ...
石材花盆购销合同范本精选20... 石材花盆购销合同范本 第一篇购货单位： (以下简称甲方)供货单位： (以下简称乙方)一、其产品名称、...
民生银行小额贷款合同范本 民生银行小额贷款合同范本　　民生银行小额贷款合同范本（精选6篇）　　在人们愈发重视契约的社会中，合同...
车辆路径问题理论与python... 问题来源 本文介绍了一类带容量约束的车辆路径问题 (Capacitated Vehicle Rout...
OKHttp 源码解析（一） 游戏SDK架构设计之代码实现——网络框架 OKHttp 源码解析（一） ...
ES6+新语法 目录 一、作用域： （1）局部作用域 （2&...
债的加入合同范本优选7篇 债的加入合同范本 第一篇出借人（甲方）：身份证号：住址：电 话：借款人（乙方）：身份证号：住址：电 ...
餐饮房屋租赁合同范本大全推荐... 餐饮房屋租赁合同范本大全 第一篇甲方：乙方：为更好提高门面的使用率，现根据国家有关法律规定，经甲、乙...
农用机械购置合同范本共20篇 农用机械购置合同范本 第一篇出租方：___________________承租方：_________...
全网最详细的OSPF综合实验 实验需求 area 0所有的路由器与帧中继交换机相连，实现全互联如图所示运行OSPFARBA 3学...
低压电缆合同范本优选29篇 低压电缆合同范本 第一篇甲方：______________身份证号码：_______________...