Vue3使用 xlsx 导出excel 数据-CSDN博客

一、安装 xlsx 库
首先在你的 Vue 3 项目中使用 npm 或 yarn 安装 xlsx 库

npm install xlsx
# 或
yarn add xlsx

二、创建一个导出 Excel 的方法
在你的 Vue 组件中创建一个方法来处理数据并导出 Excel。例如

// 引入 xlsx 库
import * as XLSX from 'xlsx';

export default {
  methods: {
    // 导出 Excel 方法
    exportToExcel() {
      // 模拟一些数据
      const data = [
        ['ID', 'Name', 'Age'],
        [1, 'Alice', 28],
        [2, 'Bob', 35],
        [3, 'Charlie', 20]
      ];
      
      // 将数据转换为工作表
      const ws = XLSX.utils.aoa_to_sheet(data);
      
      // 创建工作簿并添加工作表
      const wb = XLSX.utils.book_new();
      XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); 
      // 设置列宽
      let cols = [
         { wch: 30 },
         { wch: 30 }
          //...列
       ];
       sheet['!cols'] = cols;
           // 设置行高
       let rows = [
         { hpt: 30 },
         { hpt: 30 }
         //...行
       ];
       sheet['!rows'] = rows;
      
      // 将工作簿保存为 Excel 文件
      XLSX.writeFile(wb, "example.xlsx");
    }
  }
}