后端返回文件流,前端导出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"
        });
      });
相关推荐
心.c15 分钟前
深拷贝浅拷贝
开发语言·前端·javascript·ecmascript
IT_陈寒44 分钟前
Vue 3.4性能优化实战:5个鲜为人知的Composition API技巧让打包体积减少40%
前端·人工智能·后端
前端九哥1 小时前
💻【急招!27届前端实习生】广州4399实习太幸福了!江景+三餐+健身房全都有😭
前端·面试·招聘
咖啡の猫1 小时前
Vue全局事件总线
前端·javascript·vue.js
Lovereo1 小时前
我的目标检测性能优化之路:预算不够、GPU 没有、但性能我得要
前端
蒙娜丽宁1 小时前
Rust 与 WebAssembly:构建高效前端应用的全流程复盘
前端·rust·wasm
这儿有一堆花1 小时前
使用 Actix-web 开发高性能 Web 服务
前端·数据库
豆苗学前端1 小时前
10分钟带你入门websocket,并实现一个在线多人聊天室
前端·javascript·后端
白水清风1 小时前
Vue3之渲染器
前端·vue.js·面试
刘永胜是我2 小时前
解决Volta环境下npm全局包卸载失败:一次深入排查之旅
前端·node.js