文件导出

筱筱玉~

已于 2023-03-15 13:58:00 修改

阅读量1.3k

点赞数

文章标签： javascript http

于 2020-07-20 22:08:35 首次发布

本文链接：https://blog.csdn.net/weixin_44734152/article/details/107475450

版权

get 方法导出word文件

  // 文件导出word
  exportWordFile(url, params, eName) {
    return axios
      .get(url, {
        params,
        headers: {
          'Content-Type': 'application/json; charset=utf-8',
        },
        responseType: 'blob', // --设置请求数据格式
      })
      .then((res) => {
        if (!res.data) {
          return;
        }
        const blob = new Blob([res.data],
          {
            type:
            'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8',
          });
        if (blob.size === 0) {
          // eslint-disable-next-line consistent-return
          return '案件详情内容存在错误';
        }
        const downlodUrl = window.URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.style.display = 'none';
        link.href = downlodUrl;
        link.setAttribute('download', `${eName}.doc`);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      });
  },

get 方法导出excel文件

exportFile(url, params, eName) {
    axios
      .get(url, {
        params,
        headers: {
          'Content-Type': 'application/json; charset=utf-8', // 设置请求头接受类型
        },
        responseType: 'blob', // --设置请求数据格式
      })
      .then((res) => {
        if (!res.data) {
          return;
        }
        // 设置excel类型
        const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' });
        const downlodUrl = window.URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.style.display = 'none';
        link.href = downlodUrl;
        // eName 导出文件的名称
        link.setAttribute('download', `${eName}.xlsx`);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
        window.URL.revokeObjectURL(downlodUrl); // 释放指向这个下载url的对象
      })
      .catch((error) => {
        this.$toasted.error(error);
      });
  },

Post 方式导出excel文件

当使用post方式进行请求，后端传回来的是个数据流时

1.设置 reponseType:‘blob’
2.使用a标签进行导出

 excel_dataOut(params).then(res => {
     const aLink = document.creatElement('a')
     const blob = new Blob([res.data],{ type:'application/vnd.ms-excel' })
     const url = window.URL.createObjectURL(blob)
     aLink.download= `xxxx.xlsx`   //导出的文件名
     document.body.appendChild(aLink )
     aLink.click()
     document.body.removeChild(aLink )
     window.URL.revokeObjectURL(url) // 释放指向这个下载url的对象
 }).catch(() => {
     this.$message({
         message: '导出失败',
         type: 'warning'
     })
 })

let blob = new Blob(Array,options)

array 是一个由ArrayBuffer, ArrayBufferView, Blob, DOMString 等对象构成的 Array ，或者其他类似对象的混合体，它将会被放进 Blob。DOMStrings会被编码为UTF-8。
options 是一个可选的BlobPropertyBag字典，它可能会指定如下
两个属性：
(1) type，默认值为 “”，它代表了将会被放入到blob中的数组内容的MIME类型。
(2)endings，默认值为"transparent"，用于指定包含行结束符\n的字符串如何被写入。它是以下两个值中的一个： “native”，代表行结束符会被更改为适合宿主操作系统文件系统的换行符，或者 “transparent”，代表会保持blob中保存的结束符不变

URL.createObjectURL(blob); 
//生成一个blob链接。
URL.revokeObjectURL() 
//静态方法用来释放一个之前通过调用 URL.createObjectURL() 创建的已经存在的 URL 对象。当你结束使用某个 URL 对象时，应该通过调用这个方法来让浏览器知道不再需要保持这个文件的引用了。