后端返回文件流,前端导出excel

  1. 请求
  1. 检查接口
  1. 导出代码

(如果可以导出,且表格为undefined,把new Blob([res]换成new Blob([res.data], 或者在检查后端是不是返回的blob对象)

复制代码
ExportWaterEventListPage(data).then(res => {
        // console.log("导出闷盖记录为excel", res);
        // 转化为blob对象
        let blob = new Blob([res], {
          type: "application/octet-stream"
        });
        let filename = "放水分析记录.xls";
        // 将blob对象转为一个URL
        var blobURL = window.URL.createObjectURL(blob);
        // 创建一个a标签
        var tempLink = document.createElement("a");
        // 隐藏a标签
        tempLink.style.display = "none";
        // 设置a标签的href属性为blob对象转化的URL
        tempLink.href = blobURL;
        // 给a标签添加下载属性
        tempLink.setAttribute("download", filename);
        if (typeof tempLink.download === "undefined") {
          tempLink.setAttribute("target", "_blank");
        }
        // 将a标签添加到body当中
        document.body.appendChild(tempLink);
        // 启动下载
        tempLink.click();
        // 下载完毕删除a标签
        document.body.removeChild(tempLink);
        window.URL.revokeObjectURL(blobURL);
        this.$message({
          message: "导出成功!",
          type: "success"
        });
      });
相关推荐
Goodbaibaibai3 分钟前
Element自定义主题色
前端·css·css3
灰海10 分钟前
为什么给<a>标签设置了download属性, 浏览器没有下载而是打开新标签!!
前端·vue·html·下载·download
1024肥宅16 分钟前
面试和算法:常见面试题实现与深度解析
前端·javascript·面试
float_六七37 分钟前
行级与块级元素:核心区别与应用场景
开发语言·前端·javascript
毕设十刻1 小时前
基于Vue的家教预约系统7fisz(程序 + 源码 + 数据库 + 调试部署 + 开发环境配置),配套论文文档字数达万字以上,文末可获取,系统界面展示置于文末
前端·数据库·vue.js
前端无涯1 小时前
深度解析:fetch 与 Promise 结合实战及面试重点
前端·javascript
风舞红枫1 小时前
node代理vue打包后的文件,实现本地测试
前端·javascript·vue.js·node.js
helloCat1 小时前
记录CI/CD自动化上传AppGallery遇到的坑
android·前端·api
Yanni4Night1 小时前
使用URLPattern API构建自己的路由器 🛣️
前端·javascript
web守墓人1 小时前
【前端】garn:使用go实现一款类似yarn的依赖管理器
前端