vue2 将接口返回数据导出为 excel 文件

vue-json-excel 是一个基于 Vue.js 的表格数据导出 Excel 插件，支持将 JSON 数据转换为 Excel 文件。

安装 vue-json-excel 插件：

npm install vue-json-excel --save

页面引入 vue-json-excel 组件：

import JsonExcel from 'vue-json-excel'
components: {'download-excel': JsonExcel
}

组件形式，命名就可以像平时命名子组件一样。

点击标签就直接导出下载了，所以可以在里面写 p，el-button，img 标签都可以。

示例：

<template>
<div><download-excel:fields="jsonFields"      :data="tableData"         title="表格标题"name='下载的文件名':before-generate="startDownload":before-finish="finishDownload"worksheet="这是表格下面sheet"type="xls"><p>导出</p></download-excel></template>
</div>
<script>
export default {data() {return {tableData:[{name:'来',ssff:'了'},{name:'来ba',ssff:'了sf'},{name:'来s',ssff:'123了'},],jsonFields: {            //重命名'姓名':'name','其他':'ssff'}}},
methods:{startDownload() {console.log('导出前')},finishDownload() {this.$message.success('导出成功')}}
}
</script>