vue3导出excel

要在Vue 3中导出Excel，你可以使用库如`xlsx`或`exceljs`来生成Excel文件。下面是一个使用`xlsx`库的简单示例：

1. 安装`xlsx`库：

npm install xlsx

2. 在组件中导入`xlsx`库：

import XLSX from 'xlsx';

3. 创建一个导出Excel的方法：

exportExcel() {
  // 创建一个工作簿
  const workbook = XLSX.utils.book_new();

  // 创建一个工作表
  const worksheet = XLSX.utils.json_to_sheet([
    { Name: 'John Doe', Age: 30, Gender: 'Male' },
    { Name: 'Jane Smith', Age: 25, Gender: 'Female' },
    { Name: 'Bob Johnson', Age: 40, Gender: 'Male' }
  ]);

  // 将工作表添加到工作簿中
  XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');

  // 将工作簿转换为二进制数据流
  const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });

  // 创建Blob对象并下载文件
  const blob = new Blob([excelBuffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
  const fileName = 'data.xlsx';

  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    // 兼容IE浏览器
    window.navigator.msSaveOrOpenBlob(blob, fileName);
  } else {
    // 其他浏览器
    const url = window.URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = fileName;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
  }
}

4. 在模板中添加导出按钮，并绑定导出Excel的方法：

<template>
  <button @click="exportExcel">导出Excel</button>
</template>

当点击导出按钮时，将会生成一个名为"data.xlsx"的Excel文件。你可以根据自己的需求调整工作表的内容和格式。