使用JavaScript将JSON数据导出为XLS格式时如何调整表头顺序

问题原因 #

SheetJS的XLSX.utils.json_to_sheet方法默认会对传入JSON对象的键进行字母序重排，不会保留原始对象的键顺序，因此会出现导出表头和预期顺序不符的问题。

解决方案 #

调用json_to_sheet时通过配置项手动指定表头顺序即可，如果你使用的是动态生成的财年季度字段，可以直接提取首个数据项的键作为顺序基准，修改后的代码如下：

const xlsData = input
// 提取原始键顺序作为表头顺序，适配动态字段场景
const headerOrder = xlsData.length > 0 ? Object.keys(xlsData[0]) : []
// 传入header参数指定表头顺序
const ws = XLSX.utils.json_to_sheet(xlsData, {
  header: headerOrder,
  skipHeader: false
});
const wb = { Sheets: { 'data': ws }, SheetNames: ['data'] };
const excelBuffer = XLSX.write(wb, { bookType: 'xlsx', type: 'array' });
const data = new Blob([excelBuffer], { type: fileType });
let fileName = `test`
FileSaver.saveAs(data, fileName + fileExtension);

补充说明 #

如果你的业务场景可能出现空数组导出的情况，可以提前维护好固定的表头顺序数组直接传入header参数，不需要动态提取即可兼容。

内容的提问来源于stack exchange，提问作者Vishnu Vedagna