vue多级表头前端下载导出excel,XLSX
vue前端实现用插件导出复杂多级表头的excel,无需后端接口。
页面效果:
导出结果
1、安装插件
npm install xlsx -S
npm install file-saver --save
npm install xlsx-style --save
// pnpm install xlsx-style-vite -D // vue3可以兼容vite项目
vue2安装xlsx-style可能有报错,需在vue.config.js加入:
module.exports = {
configureWebpack: {
externals: {
'./cptable': 'var cptable'
},
}
}
2、应用:实现导出exel,设置列宽、字体、居中
<el-button type="button" @click="exportExcel('下载的表名字')">下载</el-button>
<el-table :data="cTableData" ref="report-table">
<!-- 内容-->
</el-table>
<script