uniapp + vue3开发中组合式函数必须是一个同步函数

news2024/11/23 10:17:21

目录

vue3中的组合式函数用法:

官网示例异步组合式函数:同步函数写法

 改造成导出async组合式函数时:

uniapp无法使用async组合式函数的原因:


vue3中的组合式函数使用时,导出的组合式函数必须是一个同步函数。

vue3中的组合式函数用法:

官网示例异步组合式函数:同步函数写法

这是官网示例,我们按示例运行一下:

 改造成导出async组合式函数时:

会发现模块无法渲染,同时有一个警告错误:

[Vue warn]: Component <Anonymous>: setup function returned a promise, but no <Suspense> boundary was found in the parent component tree. A component with async setup() must be nested in a <Suspense> in order to be rendered. 
  at <CompositionFunction> 
  at <VanTab title="组合式函数" name="e" > 
  at <VanTabs ref=Ref< Proxy(Object) {…} > count=4 inited=false  ... > 
  at <VanTabs active="e" onUpdate:active=fn > 
  at <Test onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {__v_skip: true} > > 
  at <RouterView> 
  at <App>

原来是因为当组合式函数为一个async函数时,setup函数会变成一个promise,此时必须使用vue3中的新组件<Suspense>将组件包裹起来,否则无法渲染。

我们包起来试试:

 发现成功了。

uniapp无法使用async组合式函数的原因:

 那么,同样的操作,我们为什么在uniapp中不行呢?

因为 uniapp 不支持 <Suspense>

因此在uniapp中,只能使用同步的组合式函数写法,异步就GG

顺便贴一下报错截图:

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/457340.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

塔望3W消费战略全案丨元力参堂:从0到1,超级大单品跨越式增长

元力参堂 客户&#xff1a;上海弥富生物科技有限公司 品牌&#xff1a;元力参堂 服务&#xff1a;3W消费战略 品牌全案 项目背景 2020年初&#xff0c;一场突如其来的疫情让我们按下了暂停键&#xff0c;大家经历着疫情的考验。长时间的隔离、封闭影响到生产、消费、投资、物…

ChatGPT3分钟写的千字福尔摩斯小说,老师都分辨不出真假

AI写小说&#xff01;感受ChatGPT3分钟写的千字福尔摩斯小说&#xff01;逆天&#xff01; ChatGPT写悬疑小说 其实在最初&#xff0c;测试者要求ChatGPT写一个5000字的故事&#xff0c;但AI居然直接罢工&#xff0c;还言简意赅&#xff1a;“不&#xff0c;太长了。” 于是…

MySQL库和表的操作

1 什么是数据库&#xff1f;什么是SQL&#xff1f; 科学的组织和存储数据&#xff0c;如何高效获取和维护数据 2 一条SQL语句的执行过程 SQL语句就是一个数据库能够识别的指令语言 在实际操作过程中&#xff0c;创建连接&#xff0c;连接MySQL的server mysql -uroot -P330…

PMP证书备考攻略+PMP知识点汇总

一&#xff0c;考PMP好处多 1.能力提升 大型项目&#xff0c;领导专业团队 2.升职加薪 晋升管理岗&#xff0c;优先升职加薪 3.招投标加分 具有PMP证书&#xff0c;企业招标有加分 4.转型利器 助力转型&#xff0c;拓宽职业发展 5.公司支持 企业鼓励学习&#xff0c;报销费用 6…

LVS负载均衡-DR

1.DR模式中每台主机都有一个VIP地址 虚拟网址放在lo网卡上&#xff08;回环网卡&#xff09; arp_ignore1 Arp_announce2 系统不使用IP包的源地址来设置ARP请求的源地址&#xff0c;而选择发送接口的IP地址 2.内核参数修改 3.vim /etc/rc.conf 开机自启动 Chmod x /etc/rc.d…

Spring Security实战(六)—— 跨域与CORS

跨域是一种浏览器同源安全策略&#xff0c;即浏览器单方面限制脚本的跨域访问。 一、认识跨域 跨域&#xff08;Cross-Origin&#xff09;指的是在Web开发中&#xff0c;当一个网页的内容要从不同源&#xff08;即不同的域名、协议或端口&#xff09;获取时&#xff0c;就会发…

时序分析与时序约束知识总结

文章目录 时序分析如何查看时序报告时序分析的分类和任务HOLD违例修复&#xff1a;SETUP违例修复&#xff1a;时序违例的修复 时序约束约束的分类时序约束的作用SDF文件OCVPVT共同路径悲观效应(CPP)setup time与hold time和什么有关clock Jitter与clock Skewsetup和hold裕度计算…

10.java程序员必知必会类库之邮件

前言 邮件功能在当前互联网应用中已经是很成熟的功能&#xff0c;也是作为java程序员应该掌握的技能。常见使用场景有&#xff1a; 电商软件开电子发票&#xff0c;需要发到用户邮箱里面生产实时报警&#xff0c;需要发到邮箱里面银行软件申请的征信报告&#xff0c;电子账单…

Django框架之Admin站点管理

Django的强大体现在其内置的Admin模块可以使得开发人员在不做任何编码的情况下就拥有网站后台管理功能。 概述 内容发布&#xff1a;负责添加、修改、删除内容 内容访问查看 配置admin应用 在settings.py中添加django.contrib.admin 默认已添加 创建管理员账户 python man…

九、1~8文章的阶段案例

一、案例 现在我们来做一个相对综合一点的练习&#xff1a;书籍购物车 案例说明&#xff1a; 1.在界面上以表格的形式&#xff0c;显示一些书籍的数据&#xff1b;2.在底部显示书籍的总价格&#xff1b;3.点击或者-可以增加或减少书籍数量&#xff08;如果为1&#xff0c;那…

【论文精读】ISBI 2022 - Retinal Vessel Segmentation with Pixel-wise Adaptive Filters

【论文精读】ISBI 2022 - Retinal Vessel Segmentation with Pixel-wise Adaptive Filters 【论文原文】&#xff1a;Retinal Vessel Segmentation with Pixel-wise Adaptive Filters 【作者信息】&#xff1a;Li, Mingxing and Zhou, Shenglong and Chen, Chang and Zhang, …

【Linux】线程-线程控制

线程控制 线程控制线程创建线程终止线程等待分离线程 线程控制 使用线程需要注意的是&#xff0c;需要引入头文件pthread.h&#xff0c;并且在编译的时候&#xff0c;需要使用-lpthread 线程创建 int pthread_create(pthread_t *thread, const pthread_attr_t *attr, void *(*…

QT中TCP的学习

文章目录 qt中TCP的实现 qt中TCP的实现 学习视频 QT中可以通过TCP协议让服务器和客户端之间行通信。服务器和客户端的具体流程 下方的信号都是系统提供的&#xff0c;我们只需要写相应的槽函数 A、服务器&#xff1a; 创建QTcpServer对象启动服务器&#xff08;监听&…

Flutter ListView组件详解

今天是2023年4月24日 今天重新复习了一下关于ListView的内容&#xff0c;现在就重新整理一下关于ListView的内容和理解 : (1)ListView和Column之间有什么区别&#xff1f; 在我理解中ListView和Column都是可以有很多子组件的组件&#xff0c;它们之间区别在于它们排列的形式和…

python实现AI写歌词GUI版本【文末源码】

**引言&#xff1a;**自然语言处理作为人工智能的一个重要分支&#xff0c;在我们的生活中得到了广泛应用。其中RNN算法作为自然语言处理的经典算法之一&#xff0c;是文本生成的重要手段。而今天我们就将利用RNN算法建立一个写歌词的软件。其中的界面如下&#xff1a; RNN指的…

使用binding时,LayoutSubscribeFragmentBinding报错

LayoutRecommendFragmentBinding是一个DataBinding类&#xff0c;它由编译器自动生成&#xff0c;用于访问布局文件中的视图。如果你在代码中看到LayoutRecommendFragmentBinding报红&#xff08;提示未解析的引用&#xff09;&#xff0c;可能有以下原因&#xff1a; 1. 检查…

Docker 的数据管理(dockerfile)

Docker 的数据管理&#xff08;dockerfile&#xff09; 管理 Docker 容器中数据数据卷数据卷容器端口映射 容器互联&#xff08;使用centos镜像&#xff09;Docker 镜像的创建1&#xff0e;基于现有镜像创建2&#xff0e;基于本地模板创建3&#xff0e;基于Dockerfile 创建镜像…

Android主流网络请求开源库的对比

目录 一、为什么要用网络请求开源库&#xff1f; 网络请求开源库是一个将网络请求的相关功能封装好的类库 没有网络请求框架之前 App想与服务器进行网络请求交互是一件很痛苦的事&#xff1a;因为Android的主线程不能进行网络请求&#xff0c;需另开1个线程请求、考虑到线程池…

软件工程开发文档写作教程(03)—开发文档的必备条件

本文原创作者&#xff1a;谷哥的小弟作者博客地址&#xff1a;http://blog.csdn.net/lfdfhl本文参考资料&#xff1a;电子工业出版社《软件文档写作教程》 马平&#xff0c;黄冬梅编著 必备条件概述 软件系统配备软件文档不仅对于公司非常有益&#xff0c;而且也能够让客户从中…

【Linux】【配置】网络连接

NetworkManager介绍 NetworkManager 是一个在 Linux 系统上管理网络连接的系统服务和工具。它可以自动配置和管理有线、无线、移动宽带和虚拟专用网络 (VPN) 连接&#xff0c;以及其他类型的网络连接。 NetworkManager 提供了一种简单且易于使用的方法来管理网络连接&#xff…