后端返回文件流,前端导出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"
        });
      });
相关推荐
FelixBitSoul3 分钟前
彻底吃透 React Hook:它背后的执行模型到底是什么? 🚀
前端
Huanzhi_Lin9 分钟前
Nginx本地资源服务器-常用脚本
服务器·前端·nginx·batch·静态资源服务器
weixin1997010801610 分钟前
《好看视频商品详情页前端性能优化实战》
前端·性能优化·音视频
有意义10 分钟前
深入理解浏览器存储方案:从Cookie到JWT登录认证
前端·面试·浏览器
jiayong2311 分钟前
第 6 课:第二轮真实重构,拆出任务表格组件
前端·重构
jiayong2318 分钟前
第 4 课:怎么把一个大页面拆成多个组件
运维·服务器·前端
skywalk816321 分钟前
使用DuMate帮助创建 Python 3.9 环境并部署 Kotti CMS
前端·chrome
英俊潇洒美少年24 分钟前
Vue Hook 与 React Hook 全面解析:区别、用法、实战及避坑指南
前端·vue.js·react.js
weixin_7042660532 分钟前
项目总结一
java·前端·spring boot·后端·spring
Mintopia32 分钟前
接口设计为什么越改越乱:新手最容易踩的三个坑
前端