Element ui表格导出Excel

Element ui表格导出Excel

首先安装依赖项：
npm install -S file-saver xlsx
或者是以下命令，这两个命令一样。
npm install --save xlsx file-saver

file-saver：保存文件

xlsx：电子表格解析器

首先我们有一个表格，并给表格一个id。

然后我们引入依赖

// 在script中引入
import fileSaver from 'file-saver'
import xlsx from 'xlsx'

然后在methods中写如下方法，注意替换id

//下载表格
exportExcel(){
     
/* 从表生成工作簿对象 */
    var xlsxParam = {
      raw: true } // 导出的内容只做解析，不进行格式转换，保证时间格式或者较长数字不会出现科学计数法。
	var wb = XLSX.utils.table_to_book(document.querySelector("#listname"),xlsxParam);
	/* 获取二进制字符串作为输出 */
	var wbout = XLSX.write(wb, {
     
		bookType: "xlsx",
		bookSST: true,
        type: "array"
        });
        try {
     
          FileSaver.saveAs(
            //Blob 对象表示一个不可变、原始数据的类文件对象。
            //Blob 表示的不一定是JavaScript原生格式的数据。
            //File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
            //返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成。
            new Blob([wbout], {
      type: "application/octet-stream" }),
            //设置导出文件名称
            "导出文件名称.xlsx"
          );
        } catch (e) {
     
		if (typeof console !== "undefined") console.log(e, wbout);
	}
	return wbout;
},