SheetJS(xlsx)导出Excel如何指定列顺序并保留自定义表头

使用基于SheetJS封装的xlsx库导出Excel时，要同时满足保留自定义表头、按指定顺序排列列的需求，核心是控制数据写入时的字段读取顺序，不要依赖JavaScript对象默认的键枚举顺序。

原有写法的问题 #

• 第一次实现时自定义表头写入逻辑正常，但sheet_add_json默认按对象自身的键枚举顺序写入列，无法匹配要求的列排序规则
• 后续调整列顺序时误用API：json_to_sheet的header参数仅接收数据原始字段名数组，作用是指定列的读取顺序，直接传入自定义显示文本会导致字段匹配失败，出现表头丢失、数据为空的问题

可直接复用的实现代码 #

方式1：一次性写入（推荐，逻辑清晰不易出错） #

先把表头、数据都按目标顺序整理成二维数组，一次性写入工作表，完全避免顺序错位问题：

// 1. 按要求的列顺序，定义原始数据对应的字段名数组
const sortedFieldKeys = [
  'clientName',
  'projectName',
  'sourceLanguageName',
  'targetLanguageName',
  'numItems',
  'numItemsWithoutImages',
  'numWordsCreative',
  'numWordsNonCreative'
];

// 2. 按和上述字段完全对应的顺序，定义自定义显示表头
const finalHeaders = [
  [
    this.tr.instant('shared.client') as string,
    this.tr.instant('shared.project') as string,
    this.tr.instant('shared.sourceLanguage') as string,
    this.tr.instant('shared.targetLanguage') as string,
    'Nº Items',
    this.tr.instant('reports.summarized.withoutimages') as string,
    this.tr.instant('reports.summarized.creativewrd') as string,
    this.tr.instant('reports.summarized.noncreativewrd') as string,
  ]
];

// 3. 把原始JSON数据转换为按指定列顺序排列的二维数组
const sortedData = data.map(row => sortedFieldKeys.map(key => row[key]));

// 4. 生成并导出Excel
const workBook = XLSX.utils.book_new();
// 合并表头与排序后的数据，一次性生成工作表
const workSheet = XLSX.utils.aoa_to_sheet([
  ...finalHeaders,
  ...sortedData
]);
XLSX.utils.book_append_sheet(workBook, workSheet, 'Sheet 1');
XLSX.writeFile(workBook, `Quantitative_Summarized_Report_${new Date().toLocaleString()}.xlsx`);

方式2：保留原有分步骤写入的写法 #

如果不想改动原有代码结构，只需要在调用sheet_add_json时传入排序后的字段名数组指定列顺序即可：

const workBook = XLSX.utils.book_new();
// 先写入自定义表头
XLSX.utils.sheet_add_aoa(workBook, finalHeaders);
// 写入数据时通过header参数指定列读取顺序，跳过自动生成表头的逻辑
const workSheet = XLSX.utils.sheet_add_json(workBook, data, { 
  origin: 'A2', 
  skipHeader: true,
  header: sortedFieldKeys
});

XLSX.utils.book_append_sheet(workBook, workSheet, 'Sheet 1');
XLSX.writeFile(workBook, `Quantitative_Summarized_Report_${new Date().toLocaleString()}.xlsx`);

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