一,下载插件js-xlsx
npm install --save xlsx
二,新建一个js文件用来配置(excelConfig.js)
const XLSX = require("xlsx"); //使用import有的属性无法找到
export function exportExcel(filename,data) {
let exc = XLSX.utils.book_new(); // 初始化一个excel文件
let exc_data = XLSX.utils.aoa_to_sheet(data); // 传入数据 , 到excel
// 将文档插入文件并定义名称
XLSX.utils.book_append_sheet(exc, exc_data, filename);
// 执行下载
XLSX.writeFile(exc, filename + '.xlsx');
}
三,在需要使用的页面中引入js配置文件
<template>
<div id="app">
<div>
<button @click="download">下载表格</button>
</div>
<router-view/>
</div>
</template>
<script>
import { exportExcel } from "./directive/excelConfig";
export default {
data() {
return {
exc_data:[
['姓名', '年龄' ,'性别'],
['coderkey', '24' ,'男'],
['pink', '18' ,'男'],
['coderkey', '19' ,'男'],
],
}
},
methods: {
download() {
exportExcel('vue2导出的表格',this.exc_data);
},
},
}
</script>