共计 915 个字符，预计需要花费 3 分钟才能阅读完成。
在 vue 中，使用 xlsx 库把数据导出到 excel 文件中来。
安装
npm install xlsx file-saver --save
官方文档
Sheets in VueJS Sites | SheetJS Community Edition
代码示例
拿来就用
<template>
<div>
<button @click="exportExcel">导出Excel</button>
</div>
</template>
<script>
import XLSX from 'xlsx'
export default {
methods: {
exportExcel() {
const data = [
['姓名', '年龄', '性别'],
['张三', 25, '男'],
['李四', 35, '男'],
['王五', 45, '男'],
['老六', 25, '女']
]
this.exportDataToExcel(data)
},
/**
* 将数据导出到excel
*
* @param {Array} tableData 表格数据，二维数组
* @param {string} fileName 文件名，默认当前日期时间
* @param {Array} tableTitle 表格标题，一维数组, 可在tableData中传入，也可以再次单独传入，如：['标题1', '标题1', '标题3']
* @param {string} sheetName 默认Sheet1
*/
exportDataToExcel(tableData, fileName = '', tableTitle = [], sheetName = 'Sheet1') {
// 设置表头
if (tableTitle.length > 0) {
tableData.unshift(tableTitle)
}
const ws = XLSX.utils.aoa_to_sheet(tableData)
const wb = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(wb, ws, sheetName)
if (!fileName) {
fileName = new Date().toLocaleString()
}
XLSX.writeFile(wb, fileName + '.xlsx')
}
}
}
</script>正文完
