<template>
<div>
<button @click="exportFile">导出</button>
</div>
</template>
<script>
// 纯前端实现导出
import * as ExcelJs from 'exceljs'
import {saveAs} from 'file-saver'
export default {
mounted(){
// this.exportFile()
},
methods:{
async exportFile(){
const workbook = new ExcelJs.Workbook();
const worksheet = workbook.addWorksheet('Sheet1');
worksheet.columns = [
{ header: '项目名称', key: 'projectName', width: 15 },
{ header: '分包名称', key: 'subpackageName', width: 15 },
{ header: '授标顺序', key: 'awardOrder', width: 15 }
];
const data = [
{ projectName: '项目1', subpackageName: '分包1', awardOrder: 1 },
{ projectName: '项目2', subpackageName: '分包2', awardOrder: 2 },
// 添加更多数据...
];
data.forEach((row) => {
worksheet.addRow(row);
});
const buffer = await workbook.xlsx.writeBuffer();
const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
saveAs(blob, '导出表格.xlsx');
}
}
}
</script>
注意一点:要是动态的数据,worksheet.columns只能被赋值一次,解决:多声明一个变量,用这个新变量去赋值worksheet.columns