分享一个json转化成excel的插件

1,962 阅读2分钟

custom-json2excel

闲来无事,胡乱倒腾,玩玩就好

插件安装

yarn add custom-json2excel
or
npm install custom-json2excel

使用方式

1、直接转化 json:

import Json2excel from 'custom-json2excel'
const data = [
  {
    name: '哈哈',
    age: 1,
    sex: '男',
    companyName: '公司1',
    companyAddress: '公司地址1'
  },
  {
    name: '呵呵',
    age: 2,
    sex: '女',
    companyName: '公司2',
    companyAddress: '公司地址2'
  },
  {
    name: '嘻嘻',
    age: 3,
    sex: '男',
    companyName: '公司3',
    companyAddress: '公司地址3'
  },
  {
    name: '啦啦',
    age: 4,
    sex: '女',
    companyName: '公司4',
    companyAddress: '公司地址4'
  }
]
const json2excel = new Json2excel({ data })
json2excel.generate()

2、自定义头部无需过滤字段时的使用方式:

import Json2excel from 'custom-json2excel'
const data = [
  {
    name: '哈哈',
    age: 1,
    sex: '男',
    companyName: '公司1',
    companyAddress: '公司地址1'
  },
  {
    name: '呵呵',
    age: 2,
    sex: '女',
    companyName: '公司2',
    companyAddress: '公司地址2'
  },
  {
    name: '嘻嘻',
    age: 3,
    sex: '男',
    companyName: '公司3',
    companyAddress: '公司地址3'
  },
  {
    name: '啦啦',
    age: 4,
    sex: '女',
    companyName: '公司4',
    companyAddress: '公司地址4'
  }
]
const keyMap = {
  name: '姓名',
  age: '年龄',
  sex: '性别',
  companyName: '公司名称',
  companyAddress: '公司地址'
}
const json2excel = new Json2excel({ data, keyMap })
json2excel.generate()

3、需要过滤字段时的使用方式:

import Json2excel from 'custom-json2excel'
const data = [
  {
    name: '哈哈',
    age: 1,
    sex: '男',
    companyName: '公司1',
    companyAddress: '公司地址1'
  },
  {
    name: '呵呵',
    age: 2,
    sex: '女',
    companyName: '公司2',
    companyAddress: '公司地址2'
  },
  {
    name: '嘻嘻',
    age: 3,
    sex: '男',
    companyName: '公司3',
    companyAddress: '公司地址3'
  },
  {
    name: '啦啦',
    age: 4,
    sex: '女',
    companyName: '公司4',
    companyAddress: '公司地址4'
  }
]
const keyMap = {
  name: '姓名',
  age: '年龄',
  sex: '性别',
  companyName: '公司名称',
  companyAddress: '公司地址'
}
const filters = ['sex']
const json2excel = new Json2excel({ data, keyMap, filters })
json2excel.generate()

4、需要表格标题时的使用方式:

import Json2excel from 'custom-json2excel'
const data = [
  {
    name: '哈哈',
    age: 1,
    sex: '男',
    companyName: '公司1',
    companyAddress: '公司地址1'
  },
  {
    name: '呵呵',
    age: 2,
    sex: '女',
    companyName: '公司2',
    companyAddress: '公司地址2'
  },
  {
    name: '嘻嘻',
    age: 3,
    sex: '男',
    companyName: '公司3',
    companyAddress: '公司地址3'
  },
  {
    name: '啦啦',
    age: 4,
    sex: '女',
    companyName: '公司4',
    companyAddress: '公司地址4'
  }
]
const keyMap = {
  name: '姓名',
  age: '年龄',
  sex: '性别',
  companyName: '公司名称',
  companyAddress: '公司地址'
}
const filters = ['sex']
const title = [
  { name: '个人信息', colspan: 3 },
  { name: '公司信息', colspan: 2 }
]
const json2excel = new Json2excel({ data, title })
json2excel.generate()

Props type

PropTypeDefaultsRequiredDescription
dataArray[]转化成表格初始 json 数据
orderedKeyArray[]×按照key顺序返回列,不在数组中的字段将自动过滤,优先级大于filters
filtersArray[]×需要过滤的字段数组,适用于需过滤的数据较少
keyMapObject{}×keyMap 映射表,用于自定义表格列名称
nameStringexcel×excel 表格名称
titleArray[]×表格标题名称 {name:String,colspan:Number} name:名称, colspan:列数
footerArray[]×表格最后一列名称,参数同 title
typeStringxls×生成的表格类型,可选值(xls、csv)
scopeObject /String×渲染的数据层级较深时扁平化处理
onStartFunction×生成 Excel 前的回调函数
onSuccessFunction×生成 Excel 成功的回调函数
onErrorFunction×生成 Excel 失败的回调函数