各平台兼容性

客户端            兼容性
H5                  √
iOSApp              ×
Android App         ×
微信小程序           ×

安装 ​​vue-json-excel​​ 插件

npm install vue-json-excel

在 ​​main.js​​ 文件里加入

import JsonExcel from 'vue-json-excel'

Vue.component('downloadExcel', JsonExcel)

页面加入

<download-excel :data="json_array" name="excel.xls" title="标题" worksheet="表格名称">导出Excel</download-excel>

属性名

类型

说明

data

Array

要导出的数据

fields

Object

要导出的Json对象中的字段。如果没有给定，则导出Json中的所有属性

export-fields (exportFields)

Object

这个支持用于修复其他使用变量字段的组件的问题，比如vee-validate。exportFields的工作原理与字段完全相同

type

string

mime类型[xls, csv]，默认值:xls

name

string

要导出的文件名，默认值：data.xls

title

string/Array

数据的标题可以是字符串或字符串数组（多个标题）

footer

string/Array

数据的页脚可以是字符串或字符串数组（多个页脚）

default-value (defaultValue)

string

当行没有字段值时用作回退，默认值为:"

worksheet

string

工作表选项卡的名称。默认值:“Sheet1”

fetch

Function

回调获取下载前的数据，如果设置了，它会在鼠标点击后立即运行，并在下载过程之前运行。重要提示:只有在没有定义数据支柱时才有效

before-generate

Function

在生成/获取数据之前调用方法的回调，例如：显示加载进度

before-finish

Function

回调在下载框弹出之前调用方法，例如:隐藏加载进度