vue table导出excel

// 导入必要的库
import XLSX from 'xlsx';
import { saveAs } from 'file-saver';

// 方法：将 Vue Table 数据导出为 Excel 文件
export function exportTableToExcel(tableId, fileName) {
  // 获取表格元素
  const table = document.getElementById(tableId);

  // 将 HTML 表格转换为工作表对象
  const workbook = XLSX.utils.table_to_book(table, { sheet: "Sheet1" });

  // 将工作簿转换为二进制字符串
  const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });

  // 创建 Blob 对象
  const blob = new Blob([wbout], { type: 'application/octet-stream' });

  // 使用 file-saver 库保存文件
  saveAs(blob, `${fileName}.xlsx`);
}

// 示例调用
// 假设你有一个 id 为 'myTable' 的 <table> 元素，并希望将其导出为名为 'example' 的 Excel 文件
// exportTableToExcel('myTable', 'example');

解释说明：

1. 导入库：我们使用了 xlsx 和 file-saver 两个库，分别用于处理 Excel 文件的生成和文件下载。
2. 方法定义：exportTableToExcel 函数接收两个参数：tableId（HTML 表格的 ID）和 fileName（导出的 Excel 文件名）。
3. 获取表格元素：通过 document.getElementById 获取指定 ID 的表格元素。
4. 转换为工作表对象：使用 XLSX.utils.table_to_book 将 HTML 表格转换为 Excel 工作簿对象。
5. 生成二进制字符串：通过 XLSX.write 将工作簿对象转换为二进制字符串。
6. 创建 Blob 对象：将二进制字符串封装为一个 Blob 对象。
7. 保存文件：使用 file-saver 的 saveAs 方法将 Blob 对象保存为指定名称的 Excel 文件。

你可以根据需要调整代码中的细节，例如表格的选择方式或文件名的生成逻辑。