如何在ExcelJS导出报表时将actions数组置于同一单元格？

我获取到的报表数据结构如下：

"reports": [
    {
      "id": 3,
      "operatorName": "string",
      "systemName": "string",
      "serverName": "string",
      "alertTypeName": "string",
      "procedureName": "string",
      "alertDate": "2023-04-02T06:55:59.446Z",
      "departmentName": "string",
      "noticeTypeName": "string",
      "ticket": "string",
      "alertCount": 1,
      "alertDetail": "string",
      "actions": [
        {
          "id": 1,
          "processId": 3,
          "actionTypeName": "string",
          "actionDescription": "string",
          "actionDate": "2023-04-02T06:55:59.446Z"
        }
      ]
    }
]

我使用ExcelJS编写了导出代码，但导出后actions数组的内容无法显示在同一个单元格中，期望将actions数组的所有内容展示在同一个单元格内。现有导出代码如下：

/* Get Data from Json */
let columnsArray: any[];
for (const key in json) {
  if (json.hasOwnProperty(key)) {
    columnsArray = Object.keys(json[key]);
  }
}

/* Add Data */
data.forEach((element : any) => {
  const eachRow: any[] = [];
  columnsArray.forEach((column) => {
    eachRow.push(element[column]);
  });

  if (element.isDeleted === 'Y') {
    const deletedRow = worksheet.addRow(eachRow);
    deletedRow.eachCell((cell) => {
      cell.font = {name: 'Calibri', family: 4, size: 11, bold: false, strike: true};
    });
  } else {
    worksheet.addRow(eachRow);
  }
});

worksheet.addRow([]);

/* Save Excel */
workbook.xlsx.writeBuffer().then((data: ArrayBuffer) => {
  const blob = new Blob([data], {type: EXCEL_TYPE});
  fs.saveAs(blob, excelFileName + EXCEL_EXTENSION);
});

要实现actions数组内容在同一单元格内展示，需要对数组内容进行格式化处理，并设置单元格自动换行：

1. 格式化Actions数组内容：遍历actions数组，将每个对象转换为可读文本，用换行符连接所有内容。
2. 设置单元格自动换行：给actions列的单元格开启自动换行，确保内容能完整显示。

修改后的核心代码如下：

/* Add Data */
data.forEach((element : any) => {
  const eachRow: any[] = [];
  columnsArray.forEach((column) => {
    let cellValue = element[column];
    // 处理actions数组，转换为换行分隔的文本
    if (column === 'actions' && Array.isArray(cellValue)) {
      cellValue = cellValue.map(action => 
        `ID: ${action.id}\n操作类型: ${action.actionTypeName}\n描述: ${action.actionDescription}\n时间: ${action.actionDate}`
      ).join('\n\n'); // 用两个换行分隔不同action
    }
    eachRow.push(cellValue);
  });

  let addedRow;
  if (element.isDeleted === 'Y') {
    addedRow = worksheet.addRow(eachRow);
    addedRow.eachCell((cell, colIndex) => {
      cell.font = {name: 'Calibri', family: 4, size: 11, bold: false, strike: true};
      // 给actions列设置自动换行
      if (columnsArray[colIndex] === 'actions') {
        cell.alignment = { wrapText: true, vertical: 'top' };
      }
    });
  } else {
    addedRow = worksheet.addRow(eachRow);
    addedRow.eachCell((cell, colIndex) => {
      if (columnsArray[colIndex] === 'actions') {
        cell.alignment = { wrapText: true, vertical: 'top' };
      }
    });
  }
});

说明 #

• 把每个action的字段信息用换行符拆分，不同action之间用两个换行分隔，提升可读性。
• 设置vertical: 'top'让单元格内容从顶部开始显示，避免留白。
• 开启wrapText: true后，Excel会自动调整行高以显示所有内容（也可以手动设置行高优化显示效果）。

内容的提问来源于stack exchange，提问作者Resul Sarı