React应用篇:实现导出excel

前提

准备插件

yarn add js-export-excel --save

npm install js-export-excel --save

引入

const ExportJsonExcel = require("js-export-excel");

效果展示

React应用篇:实现导出excel_第1张图片

React应用篇:实现导出excel_第2张图片

完整代码

  // 导出excel
  const downloadExcel = () => {
    const {columnKey, columnValue} = formatColumn();
    let option: LooseObject = {
      fileName: 'excel',
      datas: [],
      sheetFilter: [],
      sheetHeader: [],
      columnWidths: []
    };
    // 文件名
    option.fileName = fileName;
    // excel的数据
    option.datas = [
      {
        sheetName: "基本信息",
        sheetData: formatTableData(),
        sheetFilter: columnKey,
        sheetHeader: columnValue,
        columnWidths: [10,10,10,10]
      }
    ]
    // 创建实例
    let toExcel = new ExportJsonExcel(option);
    // 保存下载excel
    toExcel.saveExcel();
  }

React应用篇:实现导出excel_第3张图片

React应用篇:实现导出excel_第4张图片

你可能感兴趣的:(React全家桶系列,react.js,js-export-excel,excel)