前端xlsx如何导出带有超链接单元格的列表

在前端使用Excel（xlsx）格式导出数据时，如果需要包含超链接单元格，通常可以借助JavaScript库如`xlsx`和`js-xlsx`来处理。以下是一个简化的步骤：

1. **安装依赖**:
首先，你需要在项目中安装`xlsx`和`xlsx-style`库，可以用npm或yarn来安装：

   npm install xlsx js-xlsx xlsx-style

2. **创建工作簿**:
创建一个新的`XLSX`工作簿，并准备一个数组来存储数据，其中包括链接字段。例如：

   const workbook = XLSX.utils.book_new();
   const worksheet = XLSX.utils.json_to_sheet([
     { name: '姓名', link: 'https://example.com' },
     { name: '职位', link: 'http://example.org' }
   ]);

3. **添加链接样式**:
使用`xlsx-style`库提供的`styles`对象定义链接样式。例如：

   const styles = {
     hyperlink: { // 这里定义链接样式
       font: { color: "#0000FF", underline: "single" }, // 字体颜色和下划线
       alignment: { horizontal: "center", vertical: "middle" } // 对齐方式
     }
   };

4. **设置工作表链接**:
将数据中的链接转换为支持超链接的格式，然后应用样式。这通常涉及将数据项合并成一个复杂的单元格对象：

   const hyperlinks = XLSX.utils.decode_cell(worksheet['!hyperlinks']);
   for (let i = 0; i < worksheet.length; i++) {
     if ('link' in worksheet[i]) {
       worksheet[i]['!hyperlink'] = { ref: XLSX.utils.encode_cell({ r: i + 1, c: 1 }), url: worksheet[i].link };
       hyperlinks[i] = worksheet[i]['!hyperlink'];
     }
   }
   XLSX.utils.sheet_add_aoa(workbook, [worksheet], { mergeCells: true });

5. **导出文件**:
最后，使用`XLSX.writeFile`函数将工作簿导出到xlsx文件：

   XLSX.writeFile(workbook, 'export.xlsx', { bookType: 'xlsx', bookSST: false, cellStyles: true, styles }); // 生成名为'export.xlsx'的文件