vue项目中将table转化为xlsx表格文件

1. 装下面两个包

npm install -S file-saver xlsx
npm install -D script-loader

2. 引入装的包

import FileSaver from 'file-saver'
import XLSX from 'xlsx'

3. 设置触发时机 点击触发

<el-button @click="exportToExcel">导出</el-button>

4. 把table 数据 用 div 包裹起来

<div id="table_box">
    <table>
        (table表格内容,我是用elementui中的表格写的)
    </table>
</div>

 

5. 导出为xlsx

exportToExcel () {
　　// 这里获取的id 是上面包裹 表格的 id , 获取到的是区域
    let et = XLSX.utils.table_to_book(document.getElementById('table_box'));
    let etout = XLSX.write(et, { 
        bookType: 'xlsx', 
        bookSST: true, 
        type: 'array' 
    });
    try {
        FileSaver.saveAs(new Blob([etout], { 
            type: 'application/octet-stream' 
        }), 'trade-publish.xlsx');   //trade-publish.xlsx 为导出的文件名
    } catch (e) {
        console.log(e, etout) ;
    }
    return etout;
}

 

 

 

完整示例 请看https://www.cnblogs.com/liuyuexue520/p/13692751.html