当前位置: 首页 > 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('导出失败!')})}
}
http://www.lryc.cn/news/100152.html

相关文章:

  • 基于 Flink SQL CDC 数据处理的终极武器
  • uniapp使用HQChart的k线,用webSocket更新数据
  • idea的Plugins中搜索不到插件
  • flask 实现简单的登录系统demo
  • Spring Security安全配置
  • 2023Java后端开发之100道常见经典面试题
  • Redis详解,包括安装命令,应用场景,优缺点,案列分析,各个开发语言如何应用
  • AI数字人:金融数字化转型的“关键先生”
  • mac关闭VPN之后,浏览器就不能够正常上网了(图解)
  • YOLOv5改进系列(17)——更换IoU之MPDIoU(ELSEVIER 2023|超越WIoU、EIoU等|实测涨点)
  • 基于WSL2、Ubuntu和VS Code的CUDA平台运行C语言程序
  • 构建外卖系统小程序,订单管理功能实现步骤详解
  • 用asp.net开发h5网页版视频播放网站,类似优酷,jellyfin,emby
  • Redis—相关背景
  • SSL 证书过期巡检脚本
  • leetcode 面试题 01.03. URL化
  • uni-app在小米手机上运行【步骤细节】
  • 微信小程序实现日历功能、日历转换插件、calendar
  • 【浩鲸科技】济南Java后端面经
  • VMware搭建Hadoop集群 for Windows(完整详细,实测可用)
  • 【Rust 基础篇】Rust关联类型:灵活的泛型抽象
  • 学习笔记21 list
  • 微信小程序弱网监控
  • 【Linux】进程通信 — 共享内存
  • “从零开始学习Spring Boot:快速搭建Java后端开发环境“
  • 行为型-状态模式(State Pattern)
  • 大厂领导为什么喜欢跨层与下属聊天
  • Android 面试题 避免OOM(内存优化)三
  • SpringBoot集成Lock4j 底层使用Redission 实现分布锁
  • TortoiseSVN操作使用