vue点击按钮同时下载多个文件

点击下载按钮根据需要的id调接口拿到返回需要下载的文件
在这里插入图片描述
再看返回的数据结构
数组中一个对象,就是一个文件,多个对象就是多个文件
在这里插入图片描述
下载函数

 // 下载
    tableDownload(row) {
      getuploadInventoryDownload({ sysBatch: row.sysBatch, fileName: row.fileName }).then((res) => {
        console.log(res)
        res.forEach((file, index) => {
          // elink.download = decodeURI(file.headers['Content-Disposition'][0].split(';')[1].split('=')[1])
          const name = decodeURI(file.headers['Content-Disposition'][0].split(';')[1].split('=')[1])
          const name2 = name.slice(8)
          console.log(name.slice(8))
          const blob = this.buildBlob(file.body)
          this.downLoadFile(blob, name2)
        })
      })
    },
    downLoadFile(blob, filename) {
      const link = document.createElement('a')
      link.href = window.URL.createObjectURL(blob)
      link.download = filename
      document.body.appendChild(link)

      link.click()
      URL.revokeObjectURL(link.href) // 释放URL 对象
      document.body.removeChild(link)
    },
    buildBlob(data) {
      const raw = window.atob(data)
      const rawLength = raw.length
      const uInt8Array = new Uint8Array(rawLength)
      for (let i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i)
      }
      return new Blob([uInt8Array])
    },

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Linux 进程间通信

目录 管道 匿名管道&#xff08;pipe&#xff09; 有名管道&#xff08;fifo&#xff09; 小结 共享内存 消息队列 信号量 System V IPC的结构设计 Posix与System V的关系 管道 匿名管道&#xff08;pipe&#xff09; 我们知道&#xff0c;在Linux中通过fork创建的子…

YOLOv5优化改进:下采样创新篇 | 新颖的下采样ADown | YOLOv9

💡💡💡本文独家改进:新颖的下采样ADown来自于YOLOv9,助力YOLOv5,将ADown添加在backbone和head处,提供多个yaml改进方法 💡💡💡在多个私有数据集和公开数据集VisDrone2019、PASCAL VOC实现涨点 收录 YOLOv5原创自研 https://blog.csdn.net/m0_63774211/categ…

MongoDB 快速入门

&#x1f4d5;作者简介&#xff1a; 过去日记&#xff0c;致力于Java、GoLang,Rust等多种编程语言&#xff0c;热爱技术&#xff0c;喜欢游戏的博主。 &#x1f4d7;本文收录于MongoDB系列&#xff0c;大家有兴趣的可以看一看 &#x1f4d8;相关专栏Rust初阶教程、go语言基础…

SpringMVC--03--前端传数组给后台

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 案例1乘客个人信息方法1&#xff1a;表单提交&#xff0c;以字段数组接收方法2&#xff1a;表单提交&#xff0c;以BeanListModel接收方法3&#xff1a;将Json对象序…

电脑黑屏如何重装系统 电脑黑屏安装系统操作方法

据了解,75%以上的用户在使用电脑时都有碰到黑屏的现象,而电脑黑屏不但会影响自己的工作,而且还会影响自己的心情,因此,不可马虎,那么,应该怎么办呢?下面我们就来详细介绍一下 据了解,75%以上的用户在使用电脑时都有碰到黑屏的现象,而电脑黑屏不但会影响自己的工作,而…

vue3三级嵌套复选框(element-plus)

一、功能描述 当选择第一级的复选框时下面所有内容全选和取消全选&#xff0c;当选择第二的复选框时第三级的所有内容全选和取消全选。只要有一个第三级的内容没有选&#xff0c;二级和一级则不能勾上。第三级内容全选上了&#xff0c;第二级复选框就钩上。第二级也是同样的道理…

使用GitHub API 查询开源项目信息

一、GitHub API介绍 GitHub API 是一组 RESTful API 接口&#xff0c;用于与 GitHub 平台进行交互。通过使用 GitHub API&#xff0c;开发人员可以访问和操作 GitHub 平台上的各种资源&#xff0c;如仓库、提交记录、问题等。 GitHub API 提供了多种功能和端点&#xff0c;以…

HTTP有什么缺陷,HTTPS是怎么解决的

缺陷 HTTP是明文的&#xff0c;谁都能看得懂&#xff0c;HTTPS是加了TLS/SSL加密的&#xff0c;这样就不容易被拦截和攻击了。 SSL是TLS的前身&#xff0c;他俩都是加密安全协议。前者大部分浏览器都不支持了&#xff0c;后者现在用的多。 对称加密 通信双方握有加密解密算法…

零基础如何快速入门伦敦金交易

伦敦金交易是金融市场中备受关注的一种投资方式。对于想要学习如何炒伦敦金并快速开始交易的人来说&#xff0c;本文将为您提供一份全面而详细的指南。无论您是初学者还是有经验的交易者&#xff0c;本文都将帮助您了解伦敦金交易的基本知识&#xff0c;并提供一些实用的技巧和…

如何在 Windows 11/10 中合并分区而不丢失数据

在本文中&#xff0c;我们将了解如何在 Window 11/10 中合并分区而不丢失个人数据。每个人都会觉得需要扩大驱动器/分区的容量&#xff0c;但是在计算机中重新安装Windows对他们来说很麻烦。在 Windows PC 中合并分区的方法有很多种。我们将在下面逐步讨论一些工作方法&#xf…

IDEA中Maven无法下载jar包问题解决

在项目中经常会遇到jar包无法下载的问题&#xff0c;可以根据以下几种方法进行排查。 1. 排查网络连接 网络连接失败&#xff0c;会导致远程访问Maven仓库失败&#xff0c;所以应确保网络连接正常。 2. 排查Maven的配置 Maven配置文件&#xff08;settings.xml&#xff09;…

计算机网络-物理层-传输媒体

传输媒体的分类 导向型-同轴电缆 导向型-双绞线 导向型-光纤 非导向型

某品零食交易平台设计与实现|基于springboot+ Mysql+Java的某品交易平台设计与实现(源码+数据库+文档+PPT)

目录 基于springboot MysqlJava的某品交易平台设计与实现 摘 要 系统详细设计 数据库设计 论文参考 源码获取 文末获取源码联系 基于springboot MysqlJava的某品交易平台设计与实现 摘 要 随着科学技术的飞速发展&#xff0c;社会的方方面面、各行各业都在努力与现代的…

嵌入式驱动学习第二周——Linux内核打印

前言 这篇博客来聊一聊Linux内核打印。 嵌入式驱动学习专栏将详细记录博主学习驱动的详细过程&#xff0c;未来预计四个月将高强度更新本专栏&#xff0c;喜欢的可以关注本博主并订阅本专栏&#xff0c;一起讨论一起学习。现在关注就是老粉啦&#xff01; 目录 前言1. dmesg指令…

RabbitMQ(三):AMQP协议

目录 1 AMQP协议1.1 AMQP协议介绍1、AMQP是什么2、消息代理中间件的职责 1.2 AMQP 0-9-1模型1、AMQP的工作过程2、交换器和交换器类型3、队列队列属性队列名称队列持久化 1.3 几个概念1、绑定2、消费者3、消息确认4、预取消息5、消息属性和有效载荷&#xff08;消息主体&#x…

latex编译生成的pdf文件,图片出现浅色的线

目录 问题描述&#xff1a; 解决办法&#xff1a; 问题描述&#xff1a; 在overleaf中&#xff0c;导入图片&#xff0c;编译之后&#xff0c;不知道为什么会出现一条浅色的线&#xff0c;很影响视觉效果&#xff08;ps:在浏览器中看不到这条线&#xff0c;但是在pdf阅读器中…

window路径特殊字符解决

官方定义命名规范 https://learn.microsoft.com/zh-cn/windows/win32/fileio/naming-a-file 重点 1.目录规范 特殊字符以空格 与点.开头结尾 2.文件规范 特殊字符以空格 与点.开头结尾NUL、COM等文件 解决方案 字符标点符号实际上在字符集定义中有一个很有趣的现象&…

两天学会微服务网关Gateway-Gateway HelloWorld快速入门

锋哥原创的微服务网关Gateway视频教程&#xff1a; Gateway微服务网关视频教程&#xff08;无废话版&#xff09;_哔哩哔哩_bilibiliGateway微服务网关视频教程&#xff08;无废话版&#xff09;共计17条视频&#xff0c;包括&#xff1a;1_Gateway简介、2_Gateway工作原理、3…

【C语言基础】:深入理解指针(二)

文章目录 深入理解指针一、指针运算1. 指针 - 整数2. 指针 - 指针3. 指针的关系运算 二、野指针1. 野指针成因2. 如何避免野指针 三、assert断言四、指针的使用和传址调用4.1 strlen的模拟实现4.2 传值调用和传址调用 五、指针与数组5.1 数组名的理解5.2 指针访问数组5.3 一维数…

解放人力,提升品质:码垛输送机的工业应用与价值

在现代工业生产中&#xff0c;码垛输送机已成为许多企业自动化生产线上的关键设备。它不仅可以提高生产效率&#xff0c;降低人力成本&#xff0c;还能确保产品质量&#xff0c;并为企业带来许多其他方面的实际好处。 1. 提高生产效率&#xff1a; 快速码垛&#xff1a;码垛输…