npm install vue-json-excel
import JsonExcel from 'vue-json-excel'
Vue.component('downloadExcel', JsonExcel)
<template>
<div class="home">
<download-excel
:data = "json_data"
:fields = "json_fields"
name = "用户统计列表">
导出Excel
</download-excel>
</div>
</template>
<script>
export default {
data() {
return {
json_fields: { //导出Excel表格的表头设置
'序号': 'type',
'姓名': 'userName',
'年龄': 'age',
'手机号': 'phone',
'注册时间': 'createTime',
},
json_data:[
{"userName":"张三","age":18,"phone":15612345612,"createTime":"2019-10-22"},
{"userName":"李四","age":17,"phone":15612345613,"createTime":"2019-10-23"},
{"userName":"王五","age":19,"phone":15612345615,"createTime":"2019-10-25"},
{"userName":"赵六","age":18,"phone":15612345618,"createTime":"2019-10-15"},
]
};
},