利用JavaScript和xlsx库实现Excel (.xlsx) 文件下载功能

要在JavaScript中实现Excel（.xlsx）文件的下载功能，你可以使用几个库，如FileSaver.js（用于保存文件）和xlsx（如SheetJS的xlsx库，用于创建Excel文件内容）。

以下是一个简单的步骤和示例代码，说明如何使用这些库来创建并下载Excel文件：

1. 安装必要的库

使用npm（Node.js的包管理器）安装file-saver和xlsx库：

npm install file-saver xlsx
npm install file-saver xlsx
npm install file-saver xlsx

2. 编写JavaScript代码

// 引入所需的库  
import { saveAs } from 'file-saver';  
import XLSX from 'xlsx';  
  
// 创建一个简单的二维数组作为Excel的数据  
const data = [  
  ['Name', 'Age', 'City'],  
  ['John Doe', 30, 'New York'],  
  ['Jane Smith', 25, 'Los Angeles'],  
  // ...更多数据  
];  
  
// 使用xlsx库的工作簿和工作表API创建Excel文件内容  
const workbook = XLSX.utils.book_new();  
const worksheet = XLSX.utils.json_to_sheet(data); // 注意：这里我们假设数据是JSON格式的，但我们的数据是二维数组，所以通常我们会使用`aoa_to_sheet`  
// 因为我们的数据是二维数组，所以使用`aoa_to_sheet`  
const worksheetName = 'Sheet1';  
XLSX.utils.book_append_sheet(workbook, worksheet, worksheetName);  
  
// 将工作簿写入一个Blob对象  
const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });  
  
// 创建一个Blob对象，该对象表示要下载的数据  
const blob = new Blob([wbout], { type: 'application/octet-stream' });  
  
// 使用FileSaver的saveAs函数保存Blob对象，即下载文件  
saveAs(blob, 'example.xlsx');
// 引入所需的库  
import { saveAs } from 'file-saver';  
import XLSX from 'xlsx';  
  
// 创建一个简单的二维数组作为Excel的数据  
const data = [  
  ['Name', 'Age', 'City'],  
  ['John Doe', 30, 'New York'],  
  ['Jane Smith', 25, 'Los Angeles'],  
  // ...更多数据  
];  
  
// 使用xlsx库的工作簿和工作表API创建Excel文件内容  
const workbook = XLSX.utils.book_new();  
const worksheet = XLSX.utils.json_to_sheet(data); // 注意：这里我们假设数据是JSON格式的，但我们的数据是二维数组，所以通常我们会使用`aoa_to_sheet`  
// 因为我们的数据是二维数组，所以使用`aoa_to_sheet`  
const worksheetName = 'Sheet1';  
XLSX.utils.book_append_sheet(workbook, worksheet, worksheetName);  
  
// 将工作簿写入一个Blob对象  
const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });  
  
// 创建一个Blob对象，该对象表示要下载的数据  
const blob = new Blob([wbout], { type: 'application/octet-stream' });  
  
// 使用FileSaver的saveAs函数保存Blob对象，即下载文件  
saveAs(blob, 'example.xlsx');
// 引入所需的库  
import { saveAs } from 'file-saver';  
import XLSX from 'xlsx';  
  
// 创建一个简单的二维数组作为Excel的数据  
const data = [  
  ['Name', 'Age', 'City'],  
  ['John Doe', 30, 'New York'],  
  ['Jane Smith', 25, 'Los Angeles'],  
  // ...更多数据  
];  
  
// 使用xlsx库的工作簿和工作表API创建Excel文件内容  
const workbook = XLSX.utils.book_new();  
const worksheet = XLSX.utils.json_to_sheet(data); // 注意：这里我们假设数据是JSON格式的，但我们的数据是二维数组，所以通常我们会使用`aoa_to_sheet`  
// 因为我们的数据是二维数组，所以使用`aoa_to_sheet`  
const worksheetName = 'Sheet1';  
XLSX.utils.book_append_sheet(workbook, worksheet, worksheetName);  
  
// 将工作簿写入一个Blob对象  
const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });  
  
// 创建一个Blob对象，该对象表示要下载的数据  
const blob = new Blob([wbout], { type: 'application/octet-stream' });  
  
// 使用FileSaver的saveAs函数保存Blob对象，即下载文件  
saveAs(blob, 'example.xlsx');

注意：

• 在上面的示例中，我使用了json_to_sheet函数，但因为我们的数据是二维数组，所以更合适的函数是aoa_to_sheet。然而，为了保持示例的简洁性，我使用了json_to_sheet并在注释中进行了说明。
• saveAs函数的第一个参数是一个Blob对象或File对象，第二个参数是要下载的文件名（包括扩展名）。
• 确保你的前端项目已经正确配置了这些库，并且可以在需要的地方导入它们。如果你使用的是像Webpack这样的模块打包器，那么这通常不是问题。但是，如果你直接在HTML文件中使用<script>标签引入JavaScript文件，那么你可能需要稍微调整导入语句或使用全局变量。