前端三种输入数据来源生成 worksheet(工作表)新手适用详细篇【SheetJS】
目录概览功能差异aoa_to_sheetjson_to_sheettable_to_sheet使用场景aoa_to_sheetjson_to_sheettable_to_sheettable_to_sheet一些options属性是否读取整个table是否跳过隐藏元素是否指定原始值sheetRowscellDates高级用法混合使用场景DOM表格增强概览方法输入数据适合场景数据结构aoa_to_sheet数组的数组已经是二维表格数据[[姓名,年龄],[张三,18]]json_to_sheet对象数组后端接口 / JSON 数据[{name:张三,age:18}]table_to_sheetHTMLtableDOM页面已有表格table.../table功能差异aoa_to_sheet处理二维数组数据数组的每个子数组对应工作表的行子数组元素对应单元格值。适合结构化数据直接转换。json_to_sheet处理对象数组每个对象对应一行对象属性名作为表头属性值填充单元格。适合API返回的JSON数据转换。table_to_sheet解析DOM中的table元素自动提取tr和td生成工作表。适合从HTML页面直接提取表格数据。使用场景aoa_to_sheetExcel 原始二维数据需要完全控制行列自定义表头constdata[[姓名,年龄],[张三,18],[李四,20]];constwsXLSX.utils.aoa_to_sheet(data);生成效果AB姓名年龄张三18李四20constdata[[Name,Age,Role],[Alice,28,Engineer],[Bob,32,Designer]];constwsXLSX.utils.aoa_to_sheet(data);json_to_sheetREST API返回的JSON响应数据库查询结果如MongoDB文档需要自动生成表头的场景constdata[{name:张三,age:18},{name:李四,age:20}];constwsXLSX.utils.json_to_sheet(data);生成效果nameage张三18李四20table_to_sheet页面已经渲染了 HTML table直接导出网页表格不想重新组织数据tableiddemotrth姓名/thth年龄/th/trtrtd张三/tdtd18/td/tr/tableconsttabledocument.getElementById(demo);constwsXLSX.utils.table_to_sheet(table);table_to_sheet一些options属性是否读取整个tabletable_to_sheet(table)是否跳过隐藏元素默认的话。隐藏列会导出table_to_sheet(table,{display:true})是否指定原始值raw: true-保持原值,数字还是数字table_to_sheet(table,{raw:true})sheetRows只读取前10行数据XLSX.utils.table_to_sheet(table,{sheetRows:10})cellDates日期存成 Date 类型XLSX.utils.table_to_sheet(table,{cellDates:true})高级用法混合使用场景当JSON数据需要特殊处理时constjsonData[{x:1,y:2},{x:3,y:4}];constaoaDatajsonData.map(item[item.x,item.y]);constwsXLSX.utils.aoa_to_sheet([[X,Y],...aoaData]);DOM表格增强处理复杂表格结构constwsXLSX.utils.table_to_sheet(table,{raw:true,// 保留原始HTML内容dateNF:YYYY-MM-DD// 自定义日期格式});所有方法最终都生成相同格式的工作表对象可配合XLSX.writeFile导出为Excel文件。官方网址一键跳转