vue3 下载xlsx 模版

安装

npm install xlsx --save

使用

<script setup lang="ts">

import * as XLSX from 'xlsx'

// 定义一个方法
const PrintXlsx = () => {
  const data = [
    [
      '栏目一',
      '栏目二',
      '栏目三',
      '栏目四',
      '栏目五',
    ]
  ]
  
  // 创建工作簿
  const workbook = XLSX.utils.book_new()
  const worksheet = XLSX.utils.aoa_to_sheet(data)
  XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1')
  // 将工作簿转换为二进制流
  const excelBuffer = XLSX.write(workbook, { type: 'array', bookType: 'xlsx' })
  // 创建 Blob 对象
  const blob = new Blob([excelBuffer], {
    type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
  })
  // 创建下载链接并触发下载
  const url = URL.createObjectURL(blob)
  const link = document.createElement('a')
  link.href = url
  link.setAttribute('download', '这个一个模版.xlsx')
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
}

</script>


<template>

 <el-button @click="PrintXlsx()">下载模版</el-button>

</template>

下载有数据的xlsx文件

<script setup lang="ts">

import * as XLSX from 'xlsx'

// 定义一个方法
const downloadData = () => {
// 这里数据必须是二维数组 [[],[],[]]
  const data = [
    ['内容0-1','内容0-2'],
    ['内容1-1','内容1-2'],
    ['内容2-1','内容2-2'],
    ['内容3-1','内容3-2'],
    ['内容4-1','内容4-2'],
  ];
  const wb = XLSX.utils.book_new();
  const ws = XLSX.utils.aoa_to_sheet(data);
  // s 表示要合并的单元格范围的左上角单元格，r 表示该单元格的行号，c 表示该单元格的列号，行列号从 0 开始计数。所以 { r: 0, c: 0 } 表示第 1 行第 1 列的单元格，即 A1 单元格。
  // // e 表示要合并的单元格范围的右下角单元格，其含义与 s 相同。所以 { r: 0, c: 1 } 表示第 1 行第 2 列的单元格，即 B1 单元格。
  // // 因此，{ s: { r: 0, c: 0 }, e: { r: 0, c: 1 } } 表示要合并第 1 行第 1 列和第 1 行第 3 列之间的元格。
  // // 注意，合并会以开始位置单元格中的内容为准，所以合并后的单元格中的内容为 A1 单元格中的内容。
  const mergeRow1 = { s: { r: 0, c: 0 }, e: { r: 0, c: 1 } };
  const mergeRow2 = { s: { r: 1, c: 0 }, e: { r: 1, c: 1 } };

  // 将合并单元格的范围添加到工作表对象的 "!merges" 属性中
  ws["!merges"] = [mergeRow1, mergeRow2];

  XLSX.utils.book_append_sheet(wb, ws, "Sheet1");

  XLSX.writeFile(wb, "这是一个文件.xlsx");
};

</script>


<template>

 <el-button @click="downloadData ()">下载模版</el-button>

</template>