file-saver blob前端导出excel文件

前端导出文件

安装 file-saver

npm install file-saver --save
TS：
npm install @types/file-saver --save-dev

使用file-saver

import { saveAs } from 'file-saver'

也可以定义全局的saveAs

declare namespace FileSaver {
    interface FileSaverOptions {
        autoBom: boolean;
    }
    
    function saveAs(data: Blob | string, filename?: string, options?: FileSaverOptions): void;

    // tslint:disable-next-line:unified-signatures
    function saveAs(data: Blob | string, filename?: string, disableAutoBOM?: boolean): void;
}

declare global {
    const saveAs: typeof FileSaver.saveAs;

    interface Window {
        saveAs: typeof FileSaver.saveAs;
    }
}

export = FileSaver;

导出excel文件

blob 对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取。
Blob 是一个构造函数，创建一个 Blob 的操作如下：

/** 下载excel文件流
 * @params data [Object] 后台返回的文件流
 *         type [String] 数据的 MIME 类型
 */
 new Blob([data], {type})
 saveAs(blob, fileName)// fileName 保存文件的名称，需要带后缀

 // 导出数据
  const exportExcelFiles = async () => {
      //请求后端接口
      fetchPolicyRenewalPolicyList({
        ...listParams,
        responseType: 'blob', //blob类型
        // download: true,
        userId: undefined,
      }).then((res) => {
        const blob = new Blob([res], { type: 'text/plain;charset=utf-8' });  //res 服务器返回的文件流
        saveAs(blob, 'xxxx文件.xlsx');
      }); 
  };