美文网首页
封装导出excel的代码

封装导出excel的代码

作者: Asuler | 来源:发表于2021-10-27 16:38 被阅读0次

使用方法:
类似ant design里table的那种格式
columns,和dataSource都是这种格式

设置range:因为这个导出如果dataSource里面有多余的字段也会跟着一起导出,所以要设置range,通过ws['!ref']来设定
范围在表格的最左上角,到columns对应的最右下角,通过XLSX.utils.encode_cell计算出对应的位置

import XLSX from 'xlsx';

const createExcel = (columns, dataSource, name) => {
    // 键值对映射成中文的title和dataIndex的Map
    const cnHeader = columns.reduce((prev, next) => ({...prev, [next.dataIndex]: next.title}), {});
    // 这里dataSource.length 不用-1,因为下面加了cnHeader
    const encode_cell = XLSX.utils.encode_cell({c: columns.length - 1, r: dataSource.length });

    const range = `A1:${encode_cell}`;
    const ws = XLSX.utils.json_to_sheet([cnHeader, ...dataSource], {skipHeader: true});
    ws['!ref'] = range;
    const wb = XLSX.utils.book_new();
    // console.log(ws,wb)
    XLSX.utils.book_append_sheet(wb, ws, name);
    XLSX.writeFile(wb, `${name}.xlsx`);
};

export default createExcel;

相关文章

网友评论

      本文标题:封装导出excel的代码

      本文链接:https://www.haomeiwen.com/subject/hwjpaltx.html