Vue3如何利用xlsx、xlsx-js-style导出Excel表格使用(适合新手)

import * as XLSX from 'xlsx';
function s2ab(s: string) {
    const buf = new ArrayBuffer(s.length);
    const view = new Uint8Array(buf);
    for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
}

export default function exportExcel(data: any,  fileName: string) {
    // 创建一个空的Workbook对象
    const wb = XLSX.utils.book_new();
    // 创建一个新的Worksheet
    const ws = XLSX.utils.aoa_to_sheet(data);

    // 将Worksheet添加到Workbook中
    XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');

    // 生成Excel文件的Binary字符串
    const excelBinaryString = XLSX.write(wb, {type: 'binary'});

    // 将Binary字符串转换为Blob对象
    const blob = new Blob([s2ab(excelBinaryString)], {type: 'application/octet-stream'});

    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = fileName;
    link.click();
    URL.revokeObjectURL(link.href);
}

// 创建一个新的Worksheet
const ws = XLSX.utils.aoa_to_sheet(data);
// 设置列宽。有几列就设置几个
wx["!cols"] = [
    {
        wpx: 180
    }
];

 // 创建一个新的Worksheet
const ws = XLSX.utils.aoa_to_sheet(data);
ws["!merges"] = [
    { 
        s: { // 合并单元格开始单元格行列信息
                r: 0, // 行号
                c: 0  // 列号
        }, 
        e: { // 合并单元格结束单元格行列信息
                r: 0, // 行号
                c: 1  // 列号
        } 
    }
];

// 上面的意思是从第1行第1列到第1行第2列的单元格。
// 需要合并几个，就写多少个{s:{r:0,c:0},e:{r:0,c:0}}

// import * as XLSX from 'xlsx';
import XLSX from 'xlsx-js-style';

function s2ab(s: string) {
    const buf = new ArrayBuffer(s.length);
    const view = new Uint8Array(buf);
    for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
}

export default function exportExcel(data: any, colsWidthArr: any, mergesArr: any, fileName: string) {
    // 创建一个空的Workbook对象
    const wb = XLSX.utils.book_new();
    // 创建一个新的Worksheet
    const ws = XLSX.utils.aoa_to_sheet(data);

    if(colsWidthArr !== null){
        ws["!cols"] = colsWidthArr
    }
    if(mergesArr !== null){
        ws["!merges"] = mergesArr;
    }
    const ColName = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']; // 列索引名
    for(let col = 0;col<data[0].length;col++){ // 根据表头，获取列号
        for(let row = 0; row<data.length;row++){ // 根据内容，获取行号
            let i = row +1; // 行号初始从1开始
            ws[ColName[col]+i]['s'] = { // 这里解析成ws['A1'].s = {};根据每个单元格索引进行设置
                alignment: {
                    vertical: 'center',
                    horizontal: 'left'
                },
                border: {
                    top: {
                        style: 'thin',
                        color: '#000000'
                    },
                    bottom: {
                        style: 'thin',
                        color: '#000000'
                    },
                    left: {
                        style: 'thin',
                        color: '#000000'
                    },
                    right: {
                        style: 'thin',
                        color: '#000000'
                    }
                }
            }
        }
    }

    // 将Worksheet添加到Workbook中
    XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');

    // 生成Excel文件的Binary字符串
    const excelBinaryString = XLSX.write(wb, {type: 'binary'});

    // 将Binary字符串转换为Blob对象
    const blob = new Blob([s2ab(excelBinaryString)], {type: 'application/octet-stream'});

    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = fileName;
    link.click();
    URL.revokeObjectURL(link.href);
}

...
if(ws[ColName[col]+i] === undefined){ // 防止内容为null时报错
    continue
}
ws[ColName[col]+i]['s'] = {
...