当前位置: 首页 > news >正文

vue前端实现同步发送请求,可设置并发数量【已封装】

新建 TaskManager.js

export default class TaskManager {constructor(maxConcurrentTasks = 1) {// 最大并发任务数// to do// 并发任务数大于1 接口开始有概率返回空值,推测是后端问题this.maxConcurrentTasks = maxConcurrentTasks;this.currentTasks = 0;this.taskQueue = [];this.allTasksDone = false; // 终结标识this.allTasksDonePromise = new Promise((resolve) => {this.resolveAllTasksDone = resolve;});}// 添加任务addTask(taskFn) {return new Promise((resolve, reject) => {this.taskQueue.push({ taskFn, resolve, reject });this.processQueue();});}// 处理任务队列async processQueue() {if (this.currentTasks >= this.maxConcurrentTasks || this.taskQueue.length === 0) {return;}if (this.allTasksDone) {// 如果已经标记为所有任务完成,则不再处理新任务return;}const { taskFn, resolve, reject } = this.taskQueue.shift();this.currentTasks++;try {const result = await taskFn();resolve(result);} catch (error) {reject(error);} finally {this.currentTasks--;if (this.currentTasks + this.taskQueue.length === 0) {this.allTasksDone = true;this.resolveAllTasksDone(); // 标记所有任务完成}this.processQueue();}}// 等待所有任务完成waitForAllTasksDone() {return this.allTasksDonePromise;}
}

在项目中使用

import TaskManager from './TaskManager'

 taskManager: null,

this.pdfLoading = true
this.taskManager = new TaskManager()
for (let i = 0; i < this.selectionChangeData.length; i++) {this.taskManager.addTask(() => this.handleDownloadReport(this.selectionChangeData[i]))
}
// 等待所有任务完成
await this.taskManager.waitForAllTasksDone()
this.pdfLoading = false
handleDownloadReport(rowData) {return new Promise((resolve, reject) => {const msg = this.$Message.loading({content: '加载中,请稍等...',duration: 0})let downloadPromises = []downloadPromises.push(this.$http.report.downloadReportExamine({reportId: rowData.id,attachmentExtension: 'pdf'}).then(respT => {// xxx}))downloadPromises.push(this.$http.report.downloadReport({reportId: rowData.id,attachmentExtension: 'pdf'}).then(respT => {// xxx}))Promise.all(downloadPromises).then(() => {msg() // 关闭加载提示resolve()}).catch(error => {console.error('下载报告时发生错误:', error)this.$Message.error('下载报告失败')msg() // 关闭加载提示reject()})})},

相关文章:

vue前端实现同步发送请求,可设置并发数量【已封装】

新建 TaskManager.js export default class TaskManager {constructor(maxConcurrentTasks 1) {// 最大并发任务数// to do// 并发任务数大于1 接口开始有概率返回空值&#xff0c;推测是后端问题this.maxConcurrentTasks maxConcurrentTasks;this.currentTasks 0;this.tas…...

vue3使用vant日历组件(calendar),自定义日历下标的两种方法

在vue3中使用vant日历组件&#xff08;calendar&#xff09;自定义下标的两种方法&#xff0c;推荐使用第二种&#xff1a; 日期下方加小圆点&#xff1a; 一、使用伪元素样式实现(::after伪元素小圆点样式会被覆盖&#xff0c;只能添加一个小圆点) 代码如下&#xff08;示例…...

Java线程池面试题

为什么要用线程池 降低资源消耗&#xff1a;通过重复利用已创建的线程降低线程创建和销毁造成的消耗提高响应速度&#xff1a;当任务到达时&#xff0c;任务可以不需要等到线程创建就能立即执行方便管理线程&#xff1a;线程是稀缺资源&#xff0c;如果无条件地创建&#xff0…...

我的 2024 年终总结

2024 年&#xff0c;我离开了待了两年的互联网公司&#xff0c;来到了一家聚焦教育机器人和激光切割机的公司&#xff0c;没错&#xff0c;是一家硬件公司&#xff0c;从未接触过的领域&#xff0c;但这还不是我今年最重要的里程碑事件 5 月份的时候&#xff0c;正式提出了离职…...

Mysql8 数据库安装及主从配置

一、MySQL8 安装 下载 MySQL 8 的安装包并将其上传到服务器。将安装包解压到指定的目录&#xff0c;例如 /opt/mysql8。创建一个名为 mysql 的用户组和一个名为 mysql 的用户&#xff0c;并将用户添加到组中。同时&#xff0c;设置用户密码并更改用户的主目录和默认 shell。配…...

Unity中UGUI的Button动态绑定引用问题

Unity中UGUI的Button动态绑定引用问题 问题代码修改代码如下总结 问题代码 Button动态绑定几个连续的按钮事件时使用for循环的i做按钮的id发现按钮点击对应不上。如下代码 for (int i 0; i < 10; i) {btn[i].onClick.AddListener(() >{Click(i);}); }/// <summary&…...

测试基础之测试分类

软件测试是确保软件产品满足预期功能、性能和用户体验要求的关键环节。它的主要目的是通过系统化的方法发现并修复软件中的缺陷&#xff0c;从而提高软件的质量和可靠性。在软件开发生命周期的不同阶段执行测试&#xff0c;以尽早发现潜在的错误或类型&#xff0c;早期发现缺陷…...

VS2022 中的 /MT /MTd /MD /MDd 选项

我们有时编译时,需要配置这个 运行库,指定C/C++运行时库的链接方式。 如下图 那么这些选项的含义是什么? /MT:静态链接多线程库 /MT选项代表“Multi-threaded Static”,即多线程静态库。选择此选项时,编译器会从运行时库中选择多线程静态连接库来解释程序中的代码,…...

socket.io

import { ref } from "vue" import io from "socket.io-client" import { getToken } from "./auth" const socket ref(null) const serverUri import.meta.env.VITE_APP_API_URL// 你的服务器地址 // const serverUri "http://172.16.3…...

latex常见问题汇总

文章目录 单行多图显示双栏插入图片 单行多图显示 \begin{figure}[t!] % case 1\centering\setlength{\tabcolsep}{0.5pt} % 图片之间的距离为0.5 point\begin{tabular}{ccc}\includegraphics[width0.30\linewidth, height0.33\linewidth]{pic/xuLun/thin.png} &\includeg…...

从数据到决策:如何利用多维度交叉分析提升企业整体效能

随着“GenAI”技术的崛起&#xff0c;数据分析在各行各业的应用也发生了深远的变化。IDC中国的调研数据显示&#xff0c;68%的企业在落地GenAI应用时认为&#xff0c;梳理和整合内部数据资产是首要任务&#xff1b;66%的企业则表示&#xff0c;搭建数据湖等数据底座是推动智能化…...

Nmap基础入门及常用命令汇总

Nmap基础入门 免责声明&#xff1a;本文单纯分享技术&#xff0c;请大家使用过程中遵守法律法规~ 介绍及安装 nmap是网络扫描和主机检测的工具。作为一个渗透测试人员&#xff0c;必不可少的就是获取信息。那么nmap就是我们从互联网上获取信息的途径&#xff0c;我们可以扫描互…...

【gopher的java学习笔记】spring web接口404了怎么办

今天新搭了一个spring boot带spring web的工程&#xff0c;不得不说&#xff0c;这java的生态是比golang要齐全一点&#xff0c;各种脚手架工程应有尽有。 因为我们的目标是有个web service&#xff0c;所以spring boot的工程搭好之后&#xff0c;就寻思着给这个spring应用添加…...

constexpr 的概念及用途

constexpr 的概念及用途 constexpr 是 C11 引入的关键字&#xff0c;用于定义常量表达式。常量表达式是指在编译时能够求值的表达式&#xff0c;也就是说&#xff0c;constexpr 用来标识那些编译器在编译时就可以计算结果的变量、函数或对象。 constexpr 在 C 中非常重要&…...

开放世界目标检测 Grounding DINO

开放世界目标检测 Grounding DINO flyfish Grounding DINO 是一种开创性的开放集对象检测器&#xff0c;它通过结合基于Transformer的检测器DINO与基于文本描述的预训练技术&#xff0c;实现了可以根据人类输入&#xff08;如类别名称或指代表达&#xff09;检测任意对象的功…...

【Spring】基于XML的Spring容器配置—— <import>标签的使用

Spring容器是Spring框架的核心部分&#xff0c;负责管理应用程序中的对象及其生命周期。Spring容器的配置方式有多种&#xff0c;其中基于XML的配置方式仍然被广泛使用&#xff0c;尤其是在一些老旧项目中。本文将详细介绍Spring容器配置中的<import>标签的使用&#xff…...

GemPy 3 地质建模快速入门指南

GemPy 3简介 GemPy 3是一款基于Python的开源三维结构地质建模软件。 GemPy 3由德国的Terranigma Solutions公司维护&#xff0c;并在GitHub上进行开源开发。它允许用户从界面和方向数据中自动创建复杂的地质模型&#xff0c;并支持随机建模以解决参数和模型不确定性问题。新版…...

智慧农业物联网传感器:开启农业新时代

在当今科技飞速发展的时代&#xff0c;农业领域正经历着一场前所未有的变革&#xff0c;而智慧农业物联网传感器无疑是这场变革中的关键利器。它宛如农业的 “智慧大脑”&#xff0c;悄然渗透到农业生产的各个环节&#xff0c;为传统农业注入了全新的活力&#xff0c;让农业生产…...

Spring Boot应用开发实战:从入门到精通

一、Spring Boot 简介 1.1 什么是 Spring Boot&#xff1f; Spring Boot 是一个开源框架&#xff0c;旨在简化新 Spring 应用的初始搭建以及开发过程。它构建在 Spring 框架之上&#xff0c;利用了 Spring 的核心特性&#xff0c;如依赖注入&#xff08;Dependency Injection&…...

salesforce Controlled by Parent 的对象如何实现部分情况 Parent可见,但是 该对象不可见

在 Salesforce 中&#xff0c;设置对象的访问控制为“Controlled by Parent”时&#xff0c;该对象的可见性通常由其主对象&#xff08;Parent&#xff09;的共享规则或权限决定。如果主对象可见&#xff0c;子对象也会自动继承可见性。然而&#xff0c;有时候我们希望实现一些…...

React 第二十节 useRef 用途使用技巧注意事项详解

简述 useRef 用于操作不需要在视图上渲染的属性数据&#xff0c;用于访问真实的DOM节点&#xff0c;或者React组件的实例对象&#xff0c;允许直接操作DOM元素或者是组件&#xff1b; 写法 const inpRef useRef(params)参数&#xff1a; useRef(params)&#xff0c;接收的 …...

TCP/IP 邮件

TCP/IP邮件是互联网通信中非常重要的应用之一。当我们发送电子邮件时&#xff0c;我们实际上并没有直接使用TCP/IP协议&#xff0c;而是通过电子邮件程序&#xff0c;例如微软的Outlook、莲花软件的Notes或Netscape Communicator等来实现。这些电子邮件程序背后使用了不同的TCP…...

前缀和与差分

目录 前缀和 一维前缀和 二维前缀和 差分 一维差分 二维差分 进阶练习NOIP普及组与提高组 前缀和 前缀和是一种思想&#xff0c;代码短小精悍是它的特点。相比于数据较大时的从头至尾遍历和优化过的双指针方法来求区间和&#xff0c;前缀和在对于数据进行处理的速度上有…...

2024国赛A问题5

问题五 龙头最大速度优化模型的建立 问题五在问题四的曲线的基础上对速度进行了约束&#xff0c;即在逐步改变龙头速度的情况下&#xff0c;各个龙身的速度也会依次改变&#xff0c;给出龙头的最大行进速度,使得舞龙队各把手的速度均不超过 2 m/s。即可依此构建一个龙头速度的…...

香橙派5Plus启动报错bug: spinlock bad magic on cpu#6, systemd-udevd/443

一、问题 如图&#xff1a; 接上调试串口&#xff0c;每次启动都会报错。不过使用过程中没有发现有什么影响。 百度查阅&#xff0c;有一位博主提到&#xff0c;但是没有细说解决方案&#xff1a; spinlock变量没有初始化_spinlock bad magic on-CSDN博客https://blog.csdn.n…...

MySQL 常用程序介绍

以下是一些常用的MySQL程序&#xff1a; 程序名作⽤mysqldMySQL的守护进程即 MySQL 服务器&#xff0c;要使⽤MySQL 服务器 mysqld必须正在运⾏状态mysql MySQL客⼾端程序&#xff0c;⽤于交互式输⼊ SQL 语句或以批处理模式从⽂件执⾏SQL的命令⾏⼯具 mysqlcheck⽤于检查、修…...

DevOps实战:用Kubernetes和Argo打造自动化CI/CD流程(1)

DevOps实战&#xff1a;用Kubernetes和Argo打造自动化CI/CD流程&#xff08;1&#xff09; 架构 架构图 本设计方案的目标是在一台阿里云ECS服务器上搭建一个轻量级的Kubernetes服务k3s节点&#xff0c;并基于Argo搭建一套完整的DevOps CI/CD服务平台&#xff0c;包括Argo CD…...

RBAC模型

RBAC模型 1.概念 RBAC&#xff1a;role based access control&#xff0c;基于角色的权限控制 三个主体 - 用户 - 角色 - 权限 授权的本质是对用户授权角色&#xff0c;假设系统的用户数量特别多的话可以对用户设置用户组。 2.RBAC表基本设计 用户表 角色表 权限表 …...

CultureLLM 与 CulturePark:增强大语言模型对多元文化的理解

本文介绍团队刚刚在加拿大温哥华召开的顶会NeurIPS 2024上发表的两篇系列工作&#xff1a;CultureLLM 和CulturePark。此项研究以生成文化数据并训练文化专有模型为主要手段&#xff0c;旨在提升已有基础模型的多文化理解能力&#xff0c;使得其在认知、偏见、价值观、在线教育…...

sentinel学习笔记6-限流降级(上)

本文属于sentinel学习笔记系列。网上看到吴就业老师的专栏&#xff0c;写的好值得推荐&#xff0c;我整理的有所删减&#xff0c;推荐看原文。 https://blog.csdn.net/baidu_28523317/category_10400605.html sentinel 实现限流降级、熔断降级、黑白名单限流降级、系统自适应…...

redis cluster集群

华子目录 什么是redis集群redis cluster的体系架构什么是数据sharding&#xff1f;什么是hash tag集群中删除或新增节点&#xff0c;数据如何迁移&#xff1f;redis集群如何使用gossip通信?定义meet信息ping消息pong消息fail消息&#xff08;不是用gossip协议实现的&#xff0…...

设计模式从入门到精通之(二)抽象工厂模式

抽象工厂模式&#xff1a;不同工厂背后的协作秘密 在上一期中&#xff0c;我们聊到了工厂模式&#xff0c;讲述了如何用一家咖啡店来帮我们制作不同类型的咖啡。那么&#xff0c;如果你不仅需要咖啡&#xff0c;还需要配套的甜品&#xff0c;比如蛋糕或饼干&#xff0c;这时应该…...

LeetCode:404.左叶子之和

跟着carl学算法&#xff0c;本系列博客仅做个人记录&#xff0c;建议大家都去看carl本人的博客&#xff0c;写的真的很好的&#xff01; 代码随想录 LeetCode&#xff1a;404.左叶子之和 给定二叉树的根节点 root &#xff0c;返回所有左叶子之和。 示例 1&#xff1a; 输入: …...

Java包装类型的缓存

Java 基本数据类型的包装类型的大部分都用到了缓存机制来提升性能。 Byte,Short,Integer,Long 这 4 种包装类默认创建了数值 [-128&#xff0c;127] 的相应类型的缓存数据&#xff0c;Character 创建了数值在 [0,127] 范围的缓存数据&#xff0c;Boolean 直接返回 True or Fal…...

2024网络安全学习路线 非常详细 推荐学习

关键词&#xff1a;网络安全入门、渗透测试学习、零基础学安全、网络安全学习路线 首先咱们聊聊&#xff0c;学习网络安全方向通常会有哪些问题 1、打基础时间太长 学基础花费很长时间&#xff0c;光语言都有几门&#xff0c;有些人会倒在学习 linux 系统及命令的路上&#xff…...

【ES6复习笔记】数值扩展(16)

介绍 在 JavaScript 中&#xff0c;数值扩展提供了一些额外的功能&#xff0c;使得处理数值变得更加方便。本教程将介绍一些常用的数值扩展方法和属性。 1. Number.EPSILON Number.EPSILON 是 JavaScript 表示的最小精度。它的值接近于 2.2204460492503130808472633361816E-…...

【mybatis】详解 # 和 $ 的区别,两者分别适用于哪种场景,使用 $ 不当会造成什么影响

# 和 $ 的区别 在MyBatis中&#xff0c;# 和 $ 是用来处理参数的两种不同方式&#xff0c;它们之间有一些重要的区别&#xff1a; # 符号&#xff1a; # 是用来进行参数占位符的&#xff0c;它会进行 SQL 注入防护。使用 # 时&#xff0c;MyBatis 会将参数值进行预处理&…...

【MySQL】索引 面试题

文章目录 适合创建索引的情况创建索引的注意事项MySQL中不适合创建索引的情况索引失效的常见情况 索引定义与作用 索引是帮助MySQL高效获取数据的有序数据结构&#xff0c;通过维护特定查找算法的数据结构&#xff08;如B树&#xff09;&#xff0c;以某种方式引用数据&#xf…...

QT调用Sqlite数据库

QT设计UI界面&#xff0c;后台访问数据库&#xff0c;实现数据库数据的增删改查。 零售商店系统 数据库表&#xff1a; 分别是顾客表&#xff0c;订单详情表&#xff0c;订单表&#xff0c;商品表 表内字段详情如下&#xff1a; 在QT的Pro文件中添加sql&#xff0c;然后添加头…...

Flutter富文本实现学习

Flutter 代码如何实现一个带有富文本显示和交互的页面。 前置知识点学习 RealRichText RealRichText 和 ImageSpan 不是 Flutter 框架中内置的组件&#xff0c;而是自定义的组件或来自第三方库。这些组件的实现可以提供比标准 RichText 更丰富的功能&#xff0c;比如在富文本…...

实现某海外大型车企(T)Cabin Wi-Fi 需求的概述 - 4

大家好&#xff0c;我是Q&#xff0c;邮箱&#xff1a;1042484520qq.com。 今天我们在上几讲的基础上再扩展下 Cabin Wi-Fi 的功能需求&#xff0c;讲讲如何使能 5G TCU Wi-Fi STA Bridge 模式。 参考&#xff1a; 实现某海外大型车企&#xff08;T&#xff09;Cabin Wi-Fi 需求…...

【GeekBand】C++设计模式笔记15_Proxy_代理模式

1. “接口隔离” 模式 在组件构建过程中&#xff0c;某些接口之间直接的依赖常常会带来很多问题&#xff0c;甚至根本无法实现。采用添加一层间接&#xff08;稳定&#xff09;接口&#xff0c;来隔离本来互相紧密关联的接口是一种常见的解决方案。典型模式 FacadeProxyAdapte…...

项目练习:若依系统的svg-icon功能实现

文章目录 一、svg图片准备二、自定义Svg组件三、svg插件开发四、Svg组件使用 一、svg图片准备 src/assets/icons/svg 其中svg目录里&#xff0c;存放了所需要的图片 index.js import Vue from vue import SvgIcon from /components/SvgIcon// svg component// register glob…...

【踩坑/Linux】Vmware中的Ubuntu虚拟机无法访问互联网

Vmware中的Ubuntu虚拟机无法访问互联网 首先前提是我的系统是Ubuntu 16.04系统&#xff0c;vmware workstation选择的是NAT模式&#xff0c;虚拟机内连不上网络 ping www.baidu.com ping: unknown host www.baidu.com首先检查 DNS 解析服务&#xff1a;在虚拟机中打开命令提示…...

深入了解SpringIoc(续篇)

目录 注入 Bean 的方式有哪些? 构造函数注入还是 Setter 注入? Bean 的作用域有哪些? Bean 是线程安全的吗? Bean 的生命周期了解么? 注入 Bean 的方式有哪些? 依赖注入 (Dependency Injection, DI) 的常见方式&#xff1a; 构造函数注入&#xff1a;通过类的构造函…...

嵌入式硬件面试题

1、请问什么是通孔、盲孔和埋孔&#xff1f;孔径多大可以做机械孔&#xff0c;孔径多小必须做激光孔&#xff1f;请问激光微型孔可以直接打在元件焊盘上吗&#xff0c;为什么&#xff1f; 通孔是贯穿整个PCB的过孔&#xff0c;盲孔是从PCB表层连接到内层的过孔&#xff0c;埋孔…...

散斑/横向剪切/迈克尔逊/干涉条纹仿真技术分析

摘要 本博文提供了多种数据类型的干涉条纹仿真&#xff0c;并展示了它们对应的散斑干涉条纹。还分别给出了横向剪切干涉以及剪切散斑干涉条纹的仿真。 一、迈克尔逊干涉与散斑干涉仿真 下图为干涉条纹与对应的散斑干涉条纹的仿真示意图。其中&#xff0c;干涉条纹可认为是源…...

ViiTor实时翻译 2.2.1 | 完全免费的高识别率同声传译软件

ViiTor实时翻译是一款完全免费的实时语音翻译和同声传译软件&#xff0c;支持即时翻译、对话翻译、语音转文字、文本语音合成和AR翻译等功能。它的语音识别和翻译准确率特别高&#xff0c;速度非常快&#xff0c;音质高&#xff0c;并支持6种音色切换。该软件简单易用&#xff…...

uniapp实现为微信小程序扫一扫的功能

引言 随着微信小程序的快速发展,越来越多的开发者开始关注和学习微信小程序的开发。其中,微信小程序的扫一扫功能是非常常用且实用的功能之一。通过扫描二维码,用户可以获取到相关的信息或者实现特定的功能。 正文 在过去,开发者需要使用微信开发者工具以及相关的开发文档…...

ospf 的 状态机详解

OSPF&#xff08;开放最短路径优先&#xff0c;Open Shortest Path First&#xff09;协议的状态机是其核心部分之一&#xff0c;用于确保路由器之间的邻接关系&#xff08;neighbor relationship&#xff09;建立和路由信息的交换。OSPF的状态机模型由多个状态组成&#xff0c…...