也可以去看我的方法2：https://www.cnblogs.com/yingyigongzi/p/10915403.html
-------------------------------------------------------------------------------------
參考1：http://www.pianshen.com/article/613969950/
參考2：https://www.cnblogs.com/Mrfan217/p/6944238.html
npm安裝:
cnpm install -S file-saver xlsx cnpm install -D script-loader
下載所需的兩個文件：Blob.js、Export2Excel.js
https://download.csdn.net/download/badao_liumang_qizhi/10767801
或者：
https://gitee.com/BenDanXianSheng/excel_relyon.git
新建vendor，名稱不一定非是vendor，建議但不非得將此目錄放在與單頁面同級的目錄。將上面兩個js文件放在vendor目錄中。
比如：我自己在src下的assets下自己新建了一個文件夾vendor，把Blob.js、Export2Excel.js放入其中
然后
修改配置文件
在項目目錄下的build下的 webpack.base.conf.js這個webpack的配置文件中的
resolve的alias中加入：
'vendor':path.resolve(__dirname,'../src/account/vendor'),
具體路徑根據實際而寫，這里是按照我的方式寫的路徑。
實現代碼
點擊導出按鈕
<template>
<div>
<Button type="success" @click="export2Excel">Success</Button>
</div>
</template>
<script>
// 參考：https://www.cnblogs.com/Mrfan217/p/6944238.html
export default {
name:'',
data () {
return {
}
},
methods: {
export2Excel() {
require.ensure([], () => {
const { export_json_to_excel } = require('vendor/Export2Excel');
const tHeader =
[
'編號', '標題', '作者','回顧', '時間'
];
const filterVal =
['id', 'title','author','pageviews','display_time'];
const list =
[
{id: 1, title: 2, author: 3, pageviews: 4, display_time: 5},
{id: 6, title: 7, author: 8, pageviews: 9, display_time: 10},
{id: 11, title: 12, author: 13, pageviews: 14, display_time: 15},
];
const data = this.formatJson(filterVal, list);
export_json_to_excel(tHeader, data, '**賬單報表');
})
},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => v[j]))
}
},
computed:{
},
}
</script>
<style scoped>
</style>