elementui导出表格

导出表格分为两种：1、全部导出 2、选择对应的行与列导出

全部导出

1、Element组件库中的el-table表格导出需要的主要是两个依赖:(xlsx 和 file-saver)

安装

npm install --save xlsx file-saver

2、 给表格添加一个id，导出文件事件需要使用

<el-table
        :data="tableData"
        border
        style="width: 100%"
        id="out-table"//这一步很重要
        >

<button @click="handleDownload">点击导出</button>

handleDownload(){
        /* 从表生成工作簿对象 */
        var wb = XLSX.utils.table_to_book(document.querySelector("#out-table"));
        /* 获取二进制字符串作为输出 */
        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" }),
            //设置导出文件名称
            "idea.xlsx"
            );
        } catch (e) {
            if (typeof console !== "undefined") console.log(e, wbout);
        }
        return wbout;
      }

https://www.jianshu.com/p/1971f