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

table 导出表格 Excel

在请求中需要设置 responseType: blob

export const requestExport = (api, method, params = {}, config) => {const apiToken = localStorage.getItem('token');const data = method === 'GET' ? 'params' : 'data';let headers = {'BackServer-Token': `${apiToken}`,};if (config?.headers) {headers = {...headers,...config.headers,};}return new Promise((resolve, reject) => {axios({...config,url: baseUrl + api,method,[data]: params,headers,responseType: 'blob'}).then(res => {if (res.status === 200) {resolve(res)}}).catch(error => {ElMessage({message: '服务器繁忙请稍后重试!',type: 'error'})reject(error);});});
};

并且核心在于函数:

export const download = (fileName, res) => {const blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});if ("download" in document.createElement("a")) {const elink = document.createElement("a");elink.download = fileName;elink.style.display = "none";elink.href = URL.createObjectURL(blob);document.body.appendChild(elink);elink.click();URL.revokeObjectURL(elink.href); // 释放URL 对象document.body.removeChild(elink);}
}

在页面中发送请求:
在 element 的表格组件中对选中的行进行导出

const exportTags = async () => {if (selectId.length < 1) {ElMessage.error('至少选择一个标签!')} else {await exportTag({'tag_ids': selectId}).then(res => {download('标签列表.xlsx', res)selectId = []}, (err) => {ElMessage.error('导出失败!')})}
}

相关文章:

table 导出表格 Excel

在请求中需要设置 responseType: blob export const requestExport (api, method, params {}, config) > {const apiToken localStorage.getItem(token);const data method GET ? params : data;let headers {BackServer-Token: ${apiToken},};if (config?.headers…...

基于 Flink SQL CDC 数据处理的终极武器

文章目录 一、传统的数据同步方案与 Flink SQL CDC 解决方案1.1 Flink SQL CDC 数据同步与原理解析1.2 基于日志的 CDC 方案介绍1.3 选择 Flink 作为 ETL 工具 二、 基于 Flink SQL CDC 的数据同步方案实践2.1 CDC Streaming ETL2.2 Flink-CDC实践之mysql案例 来源互联网多篇文…...

uniapp使用HQChart的k线,用webSocket更新数据

项目&#xff1a;不借用HQChart的各种接口数据&#xff0c;即数据后端返回&#xff0c;但是数据格式要和原数据格式一样。 //k线图 CreateHQChartKLine(){var chartHeightuni.upx2px(this.ChartHeight);let hqchartCtrlthis.$refs.HQChartCtrl;hqchartCtrl.KLine.Option.Type&…...

idea的Plugins中搜索不到插件

1、ctrlalts 打开设置 ; 2、搜索框输入plugins; 3、点击plugins; 4、点齿轮按钮&#xff0c;选择HTTP Proxy settings; 如下操作&#xff1a; 5、刷新DNS&#xff0c;ipconfig /flushdns 6、重新打开idea 的plugins 插件列表出来了...

flask 实现简单的登录系统demo

你提供的代码是一个基本的Flask应用程序&#xff0c;实现了一个简单的登录系统。以下是代码的详细解释&#xff1a; 1. 导入必要的模块&#xff1a;os 用于生成密钥&#xff0c;Flask 用于创建Web应用程序。 2. 创建Flask应用程序的实例&#xff0c;并为会话管理设置一个密钥。…...

Spring Security安全配置

使用Spring Boot与Spring MVC进行Web开发时&#xff0c;如果项目引入spring-boot- starter-security依赖启动器&#xff0c;MVC Security 安全管理功能就会自动生效&#xff0c;其默认的安全配置是在SecurityAutoConfiguration和UserDetailsServiceAutoConfiguration中实现的。…...

2023Java后端开发之100道常见经典面试题

目录 1.重载和重写的区别? 2.String 和 StringBuffer、StringBuilder 的区别是什么&#xff1f; 3. 与 equals 的区别&#xff1f; 4.抽象类和接口的区别是什么&#xff1f; 5. 面向对象的特点 6.Collection 和 Collections 有什么区别&#xff1f; 7.List、Set、Map 之…...

Redis详解,包括安装命令,应用场景,优缺点,案列分析,各个开发语言如何应用

目录 1、安装命令2、应用场景3、优缺点4、案例分析5、各个开发语言如何应用&#xff1f; Redis 是一个基于内存的开源数据库系统&#xff0c;被广泛应用于 Web 应用、消息队列、缓存、实时统计等领域。下面是 Redis 的详解&#xff0c;包括安装命令、应用场景和优缺点&#xff…...

AI数字人:金融数字化转型的“关键先生”

今年年初ChatGPT的火热&#xff0c;在全球掀起一阵生成式AI&#xff08;AIGC&#xff09;热潮。国外的OpenAI、国内的百度等企业&#xff0c;都在AIGC上强力布局。 各种应用场景中&#xff0c;AIGC助力的数字人引起了市场注意。 事实上&#xff0c;数字人不是个新鲜事。早在1…...

mac关闭VPN之后,浏览器就不能够正常上网了(图解)

可能打开谷歌浏览器会显示无法正常连接网络等信息&#xff0c;这个时候可以按照以下步骤&#xff1a; 点击"检查代理服务器地址" 会显示以下这段话&#xff0c;按照这个步骤来操作就可以了。 打开系统偏好设置&#xff0c;点击网络 点击高级 取消掉所有已勾选代…...

YOLOv5改进系列(17)——更换IoU之MPDIoU(ELSEVIER 2023|超越WIoU、EIoU等|实测涨点)

【YOLOv5改进系列】前期回顾: YOLOv5改进系列(0)——重要性能指标与训练结果评价及分析 YOLOv5改进系列(1)——添加SE注意力机制...

基于WSL2、Ubuntu和VS Code的CUDA平台运行C语言程序

一、CUDA程序执行方法 执行步骤为&#xff1a; 安装Visual Studio Code。在Visual Studio Code中安装插件WSL与电脑的WSL2进行连接。点击左下角&#xff0c;然后再选择连接到WSL。 在WSL中创建以 .cu 为后缀的文件。 rootDESKTOP-HR6VO5J:~# mkdir CUDA /…...

构建外卖系统小程序,订单管理功能实现步骤详解

外卖系统小程序是近年来越来越受欢迎的一种订餐方式&#xff0c;方便快捷&#xff0c;并且可以减少人与人之间的接触&#xff0c;更加卫生安全。为了搭建一个完善的外卖系统小程序&#xff0c;订单管理功能是必不可少的一部分。在本文中&#xff0c;我们将详细介绍如何实现订单…...

用asp.net开发h5网页版视频播放网站,类似优酷,jellyfin,emby

之前用jellyfin开源软件搞了一个视频播放服务器,用来共享给家里人看电影和电视剧,jellyfin虽然各方面功能都很强大,但是界面和使用习惯都很不适合,于是就想着利用下班休息时间做一套自己喜欢的视频网站出来. 本来是打算直接用jellyfin的源码进行修改,源码是用C# netcore 写的服…...

Redis—相关背景

Redis—相关背景 &#x1f50e;Redis—特性In-memory data structures—在内存中存储数据Programmability—可编程性Extensibility—可扩展性Persistence—持久化Clustering—集群High availability—高可用 &#x1f50e;Redis 为什么快&#x1f50e;Redis 的使用场景Real-tim…...

SSL 证书过期巡检脚本

哈喽大家好&#xff0c;我是咸鱼 我们知道 SSL 证书是会过期的&#xff0c;一旦过期之后需要重新申请。如果没有及时更换证书的话&#xff0c;就有可能导致网站出问题&#xff0c;给公司业务带来一定的影响 所以说我们要每隔一定时间去检查网站上的 SSL 证书是否过期 如果公…...

leetcode 面试题 01.03. URL化

⭐️ 题目描述 &#x1f31f; leetcode链接&#xff1a;面试题 01.03. URL化 思路&#xff1a; 计算出空格的个数&#xff0c;我们可以知道最后一个字符的位置 endPos&#xff0c;再从后 end 向前遍历若不是空格正常拷贝&#xff0c;是空格则替换成 %20&#xff0c;最终当空格…...

uni-app在小米手机上运行【步骤细节】

注意细节重点&#xff1a; 1.手机使用数据线与电脑连接&#xff0c;手机连接模式必须是传输文件模式 2.手机必须打开开发者模式 3.打开开发者模式后&#xff0c;仔细浏览并调整USB调试权限&#xff0c;重点打开USB是否允许安装按钮&#xff01;&#xff01;&#xff01; 操作步…...

微信小程序实现日历功能、日历转换插件、calendar

文章目录 演示htmlJavaScript 演示 效果图 微信小程序实现交互 html <view wx:if"{{calendarArr.length}}"><view class"height_786 df_fdc_aic"><view class"grid_c7_104"><view class"font_weight_800 text_align…...

【浩鲸科技】济南Java后端面经

本文目录 写在前面试题总览题目解析1.说一下SpringBoot中常用的注解2.Redis中的基本数据类型3.TCP的网络协议4.java中常见的锁5.Hashmap的底层数据结构、底层源码、扩容机制源码6.java面向对象的特点 写在前面 关于这个专栏&#xff1a; 本专栏记录一些互联网大厂、小厂的面试实…...

Python开发者首次使用Taotoken接入大模型API的完整步骤指南

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 Python开发者首次使用Taotoken接入大模型API的完整步骤指南 对于Python开发者而言&#xff0c;接入大模型API进行应用开发已成为一…...

Arduino PWM转4-20mA工业电流信号:二阶滤波与V/I转换电路设计

1. 项目概述&#xff1a;从PWM到工业标准电流信号在工业自动化、过程控制和传感器领域&#xff0c;4-20 mA电流环是一个几乎无处不在的标准。它用4 mA代表测量值的下限&#xff08;如0C&#xff09;&#xff0c;20 mA代表上限&#xff08;如100C&#xff09;&#xff0c;这种设…...

为什么92%的DeepSeek二次开发团队在6个月内遭遇交付延迟?——基于17个真实项目的技术债务归因分析

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;为什么92%的DeepSeek二次开发团队在6个月内遭遇交付延迟&#xff1f;——基于17个真实项目的技术债务归因分析 在对17个采用DeepSeek-R1/VL模型开展定制化开发的工业级项目进行回溯审计后&#xff0c;我…...

放弃编码器!纯靠MPU6050和PID算法,手把手教你用TT马达实现平衡小车稳定控制(STM32F103C8T6实战)

纯MPU6050STM32F103的TT马达平衡车实战&#xff1a;无编码器PID控制全解析当大多数平衡小车方案都在强调编码器对速度反馈的不可或缺性时&#xff0c;我们决定挑战一个更极简的配置&#xff1a;仅用5美元的TT马达、9轴的MPU6050和STM32F103C8T6最小系统板&#xff0c;完全舍弃编…...

skills CANN开源社区贡献技能包开发指南

前言 开源社区的健康运转&#xff0c;不仅依赖核心代码的贡献&#xff0c;还需要降低贡献门槛、提供清晰的指南和自动化工具。skills仓库是CANN开源社区的"贡献技能包"&#xff0c;提供了一系列辅助脚本、代码模板、CI检查和文档生成工具&#xff0c;帮助新手快速上…...

2026 文章代码高亮方案选型

将基于 Prism.js 或 Highlight.js 的传统高亮方案与基于 Shiki 的现代化高亮方案进行对比&#xff0c;其核心区别在于底层解析原理的不同&#xff08;正则表达式 vs. TextMate 语法树&#xff09;。 以下是两种方案的底层原理、各自优缺点、核心对比矩阵以及适用场景的详细分析…...

在线文档协作工具选型必看:14款产品对比(2026版)

一、在线文档协作工具的概念解析及其核心功能 在线文档协作工具是基于云端的文档创建、编辑、共享与协同沟通平台&#xff0c;核心目标是让团队在同一份资料上“实时共同工作”&#xff0c;减少反复传文件、版本混乱与沟通成本。 企业常见的核心能力包括&#xff1a; 多人实…...

【2025】AWVS安装保姆级教程(最新25.1.2可用)

【2025】AWVS安装保姆级教程&#xff08;最新25.1.2可用&#xff09; 文章目录 工具下载Host 重定向AWVS安装AWVS查看安装失败原因 工具下载 点击下载即可 下载完的工具后缀格式为.apk&#xff0c;需要将其改为.zip&#xff0c;然后将其解压得到以下工具后续安装使用 Host 重…...

Lovable电商网站搭建:如何用不到3人技术团队,72小时内上线PCI-DSS合规MVP版本?

更多请点击&#xff1a; https://codechina.net 第一章&#xff1a;Lovable电商网站搭建 Lovable 是一个面向中小商户的轻量级电商解决方案&#xff0c;采用现代 Web 技术栈构建&#xff0c;强调可扩展性、用户体验与快速部署能力。本章将指导你从零开始搭建一个具备商品展示、…...

【RT-DETR实战】070、模型分析工具:PyTorch Profiler性能分析

上周在部署RT-DETR到边缘设备时遇到一个诡异现象:模型推理时延波动极大,有时30ms,偶尔突然跳到200ms。 盯着代码看了半天没发现逻辑问题,数据流也正常。这种时候,靠猜是没用的,必须上性能分析工具——PyTorch Profiler。 今天我们就来聊聊怎么用它揪出那些藏在细节里的…...