vue 文件下载(导出)excel的方法

目前有一个到处功能的需求,这是我用过DeepSeek生成的导出(下载)excel的一个方法。
1.excel的文件名是后端生成的,放在了响应头那里。
2.这里也可以自己制定文件名。
3.axios用的是原生的axios,不要用处理过的,有拦截等等。

    downloadFile(record) {let that = thislet apiBaseUrl = window._CONFIG['domianURL'] || "/jeecg-boot";return new Promise((resolve, reject) => {axios({url: apiBaseUrl + `/ABC/ABC?id=${record.id}&date=${record.monthTime}`,method: "GET",responseType: "blob", // importantwithCredentials: true,headers: {"X-Access-Token": Vue.ls.get(ACCESS_TOKEN),},}).then((response) => {// 处理blob响应const blob = new Blob([response.data]);const contentDisposition = response.headers["content-disposition"];// 错误处理:当响应是JSON时说明出错if (blob.type === "application/json") {const reader = new FileReader();reader.onload = () => {try {const errData = JSON.parse(reader.result);reject(errData.message || "导出失败");that.$message.error(errData.message || "导出失败");} catch (e) {reject("导出失败");that.$message.error("导出失败");}};reader.readAsText(blob);return;}// 创建下载链接const downloadUrl = window.URL.createObjectURL(blob);const link = document.createElement("a");link.href = downloadUrl;let fileName = "";if (contentDisposition) {const fileNameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;const matches = fileNameRegex.exec(contentDisposition);if (matches && matches[1]) {fileName = matches[1].replace(/['"]/g, "");fileName = decodeURIComponent(fileName);// 我这里文件名的前缀有 utf-8 所以在这里做了一个处理,如果没有,则可以注释这里fileName = fileName.replace(/^utf-8['"]?/, "");}}link.download = fileName || `export_${new Date().getTime()}.xlsx`;// 触发下载document.body.appendChild(link);link.click();// 清理资源window.URL.revokeObjectURL(downloadUrl);document.body.removeChild(link);resolve();}).catch((error) => {reject(error);that.$message.error("下载失败,请检查网络连接");});});},

其实这个通用的方法,基本可以实现所需的要求。

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

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

相关文章

Java NIO ByteBuffer 详解

什么是 ByteBuffer ByteBuffer 是 Buffer 的一个具体实现,专门用于存储和操作字节数据。它提供了高效的、基于内存的 I/O 数据处理方式。 Buffer 类是构建 Java NIO 的基础,其中 ByteBuffer 类是 Buffer 子类中最受欢迎的。这是因为字节类型是最通用的…

【大语言模型】最新ChatGPT、DeepSeek等大语言模型助力高效办公、论文与项目撰写、数据分析、机器学习与深度学习建模等科研应用

ChatGPT、DeepSeek等大语言模型助力科研应用 随着人工智能技术的快速发展,大语言模型如ChatGPT和DeepSeek在科研领域的应用正在为科研人员提供强大的支持。这些模型通过深度学习和大规模语料库训练,能够帮助科研人员高效地筛选文献、生成论文内容、进行数…

人工智能之数学基础:线性子空间

本文重点 在前面的课程中,我们学习了线性空间,本文我们我们在此基础上学习线性子空间。在应用中,线性子空间的概念被广泛应用于信号处理、机器学习、图像处理等领域。 子空间的性质 子空间是线性空间的一部分,它需要满足下面的性质: 设V是数域F上的线性空间,W是V的一个…

【清晰教程】本地部署DeepSeek-r1模型

【清晰教程】通过Docker为本地DeepSeek-r1部署WebUI界面-CSDN博客 目录 Ollama 安装Ollama DeepSeek-r1模型 安装DeepSeek-r1模型 Ollama Ollama 是一个开源工具,专注于简化大型语言模型(LLMs)的本地部署和管理。它允许用户在本地计算机…

deepseek部署在本地详细教程

最近,DeepSeek爆火,先进的算法、卓越的能力,表现出众,其凭一己之力推动国内Ai大模型跨越式发展。作为一款现象级的Ai产品,用户量暴增,最近服务器又被攻击,使用DeepSeek,经常出现服务…

DeepSeek v3 技术报告阅读笔记

注 本文参考 DeepSeek-v3 / v2 / v1 Technical Report 及相关参考模型论文本文不包括基础的知识点讲解,为笔记/大纲性质而非教程,建议阅读技术报告原文交流可发送至邮箱 henryhua0721foxmail.com 架构核心 核心: MLA 高效推理DeepSeekMOE 更…

浏览器安全学习

浏览器特性 会将一些特殊符号当做字母进行解析,此时一个符号可能会被解析成两个到三个字母,这样子如果有漏洞对输入做了限制,黑客就可以利用这个特性来绕过某些漏洞中长度限制。某些特殊字符或者其他国家的文字和某些字母的形状一模一样&…

2025年AI免费大战:从DeepSeek到GPT-5的商业逻辑与行业变革

引言:人工智能行业的2025年重大转折 2025年伊始,人工智能行业的竞争格局发生了深刻变化,尤其是以DeepSeek为代表的新兴力量,通过低成本开源策略迅速崛起,迫使OpenAI、百度文心一言等人工智能巨头纷纷调整策略&#xf…

Word写论文常用操作的参考文章

1.插入多个引用文献:word中交叉引用多篇参考文献格式[1-2]操作以及显示错误问题 更改左域名,输入 \#"[0" 更改右域名,输入 \#"0]" 2.插入题注:word 中添加图片题注、目录、内部链接 3.插入公式编号&#x…

国产化替代大势所趋,ARM工控机的未来之路

在全球技术竞争加剧和国家政策推动的背景下,中国正在经历一场前所未有的国产化替代浪潮。在这个过程中,基于ARM架构的工业控制计算机(简称ARM工控机)迎来了前所未有的发展机遇,同时也面临着诸多挑战。 机遇 技术创新驱…

uniapp商城之登录模块

文章目录 一、小程序快捷登录1.定义接口2.获取登录凭证 code3.获取手机号并登录 二、模拟快捷登录1.封装模拟登录API2.调用模拟登录 三、保存登录信息1.类型声明2.状态管理3.成功提示并跳转页面 一、小程序快捷登录 1.定义接口 2.获取登录凭证 code 3.获取手机号并登录 注意&a…

C++-----------酒店客房管理系统

酒店客房管理系统 要求: 1.客房信息管理:包括客房的编号、类型、价格、状态等信息的录入和修改; 2.顾客信息管理:包括顾客的基本信息、预订信息等的管理; 3.客房预订:客户可以根据需要进行客房的预订,系统会自动判断客房的可用情况; 4.入住管理:客户入住…

电动汽车电池监测平台系统设计(论文+源码+图纸)

1总体设计 本次基于单片机的电池监测平台系统设计,其整个系统架构如图2.1所示,其采用STC89C52单片机作为控制器,结合ACS712电流传感器、TLC1543模数转换器、LCD液晶、DS18B20温度传感器构成整个系统,在功能上可以实现电压、电流、…

2025年02月11日Github流行趋势

项目名称:unsloth 项目地址url:https://github.com/unslothai/unsloth项目语言:Python历史star数:27175今日star数:1024项目维护者:danielhanchen, shimmyshimmer, Erland366, Datta0, xyangk项目简介&…

[qt5学习笔记]用vs2022(msvc2017)+copilot进行QtWidgetsApplication源码解析

一直没深入了解qt,又一段时间没写qt,重新捡起来。 开发环境 本地vs2022(msvc2017, v14.30)先升级到最新版本,方便使用copilot。 参考 VS2022QT5环境搭建 下载 qt5.14.2 用vs的qt插件设置qt5.14.2x86路径,x64版本未安装。 创建一…

家里装修想用投影仪,如何选择?装修中应该注意什么?

越来越多的业主在装修的时候抛弃了传统的电视,采用投影仪。 和这些业主聊天,选用投影仪有两个目的,第1是把电视机拿掉,这样能让家里的小朋友不看电视,保护小朋友的眼睛。 第2是选用投影仪,幕布都会装的比较…

javaEE初阶————多线程初阶(4)

8.1 单例模式 这又是什么新的神奇玩意呢,我们先不谈单例模式,先来谈谈设计模式,什么是设计模式呢,我们只需要用设计模式就好了,而大佬们考虑的就多了,这些设计模式就像棋谱,只要按照棋谱来下&am…

能源物联网数据采集网关 多协议对接解决方案

安科瑞刘鸿鹏 摘要 随着配电系统智能化需求的提升,现代配电物联网(IoT)系统对数据采集、传输、处理及远程管理能力提出了更高要求。智能网关作为连接现场设备与上层管理平台的核心枢纽,其性能直接影响系统的实时性、可靠性与扩展…

Node.js 中的 Event 模块详解

Node.js 中的 Event 模块是实现事件驱动编程的核心模块。它基于观察者模式,允许对象(称为“事件发射器”)发布事件,而其他对象(称为“事件监听器”)可以订阅并响应这些事件。这种模式非常适合处理异步操作和…

Unity开发抖音小游戏播放视频

Unity开发抖音小游戏播放视频 介绍抖音小程序ios端视频无法播放RenderTexture问题总结 介绍 最近在做抖音小游戏播放视频,这里我使用的是Unity原生的VideoPlayer组件来播放视频,这里总结了一下我相关的报错以及能够正常播放视频的代码。如果还不知道怎么…