设置导出的表格样式，xlsx-js-style！真的绝绝子！

1.下载xlsx-js-style依赖

npm install xlsx-js-style

2.在main.js中挂载到vue原型上，方便使用

import XLSX from 'xlsx-js-style'
Vue.prototype.$xlsx = XLSX

 3.页面具体写法

exportExcel() {const th = [["序号","工号","姓名","备注",],];let newData = [];this.listData.map((item, index) => {newData.push([index + 1,item.jobNumber,item.name,item.remark]);});let excelData = th.concat(newData); //数组的拼接let workbook = this.$xlsx.utils.book_new(); // 工作簿let worksheet = this.$xlsx.utils.aoa_to_sheet(excelData); // 数据表//以下是样式设置，样式设置放在组织完数据之后，xlsx-js-style的核心API就是SheetJS的//样式的设置可以参考相关文档 贴在文章末尾第二个链接//修改列宽cols 行宽就用rows 总共11列worksheet["!cols"] = [{width: 14,},     {width: 14,},{width: 14,},{width: 20,}];// 修改行高 这里我只修改了第一行worksheet["!rows"] = new Array(this.listData.length + 1).fill({hpx: 24,});//合并第一行单元格 s和e指范围即第一行 第一列到第十一列// worksheet["!merges"] = [{ s: { r: 0, c: 0 }, e: { r: 0, c: 10 } }];Object.keys(worksheet).forEach((key) => {// 非!开头的属性都是单元格// excelData.length是我表格的长度也就是总行数//设置从第二行开始的数据样式for (let i = 1; i <= excelData.length; i++) {//用正则表达式判断是否是某一行if (key.replace(/[^0-9]/gi, "") == i) {worksheet[key].s = {//设置字体font: {name: "Arial",sz: 12,bold: false,color: { rgb: "000000" },},//设置居中alignment: {horizontal: "center",vertical: "center",wrapText: true,},//设置边框border: {top: { style: "thin" },right: { style: "thin" },bottom: { style: "thin" },left: { style: "thin" },},};}}});this.$xlsx.utils.book_append_sheet(workbook, worksheet, "Sheet1");this.$xlsx.writeFile(workbook, "a.xlsx"); //表格名称},

参考：前端根据后端返回数据导出指定样式的表格(xlsx-js-style)_前端excel导出指定格式-CSDN博客