vue 文件下载导出-功能齐全

#Ltf

已于 2022-10-31 16:33:52 修改

阅读量286

点赞数

分类专栏：笔记 vue区文章标签： vue.js javascript 前端

于 2022-08-19 11:04:44 首次发布

本文链接：https://blog.csdn.net/weixin_46032911/article/details/126420725

版权

笔记同时被 2 个专栏收录

17 篇文章 0 订阅

订阅专栏

vue区

16 篇文章 0 订阅

订阅专栏

在vue中导出excel表格，这里是先进行请求拿到文件流，再传给new Blob()对象进行下载。

dataTableExcel() {
//data为请求参数，如果有参数则可以这样写
      let data = {};
      axios
        .post("url", data, {
          responseType: "blob",
        })
        .then((res) => {
          //excel格式
          var blob = new Blob([res.data], { type: "application/vnd.ms-excel" });
          //zip格式
          var blob = new Blob([res.data], {type: "application/zip"});
          var downloadElement = document.createElement("a");
          var href = window.URL.createObjectURL(blob); // 创建下载的链接
          downloadElement.href = href;
          downloadElement.download = "表格名称.xlsx || 压缩包.zip"; // 下载后文件名
          document.body.appendChild(downloadElement);
          downloadElement.click(); // 点击下载
          document.body.removeChild(downloadElement); // 下载完成移除元素
          window.URL.revokeObjectURL(href); // 释放掉blob对象
        });
    },