vxe-table高级导出功能，导出表格样式

做为技术人员我们得感谢那么提出各种奇葩需求的人，因为他们才使我们更快成长。如果你干不掉那些提出需求的人，那么就接受吧，废话止于此。

先看下导出表格的效果

vxe-table的高级导出功能的弹窗里虽然有样式的勾选项，但是还需要你通过exportConfig.sheetMethod属性方法对导出表格进行配置，并不是勾选后就能导出你页面上显示的样式

运行框架：vue2.5.2……

使用插件：vxe-table v3.5.9

目的要求：导出excel时，要把单元格背景颜色一并导出

此处理使用的时vxe-grid组件，一切都是操作配置项 gridOptions

1. 开启工具栏导出功能，要使用高级导出

toolbarConfig: {
    ……
    export: true
}

2. 操作导出配置

// 导出配置
exportConfig: {
   remote: false, // 开启远程导出
   sheetMethod: this.sheetMethod, // 配置导出样式
   useStyle: true, // 重要 如果没有设置这项 就不会调用this.sheetMethod方法
   types: ["xlsx"],
   modes: ["current", "selected"] // current当前页，selected选中的，all所有的
},

3. 实现方法 sheetMethod

// 设置导出表样式
sheetMethod({ options, worksheet }) {
   const data = options.data;
   const columns = options.columns;
   const key = columns.find(f => f.field === "fastCycle").id;
 
   data.forEach((f, i) => {
      if (f["fastCycle"] != f["fastCycleOld"]) {
        const row = worksheet.getRow(i + 1);
        const cells = row._cells;
        const address = cells.find(f => f._column._key == key).address;
        const chartAt = address.replace(/\d/, "");
        // 通过worksheet操作表格样式，这里只是填充了背景色，还可以操作其它表格的功能
        worksheet.getCell(chartAt + (i + 2)).fill = {
          type: "pattern",
          pattern: "solid",
          fgColor: { argb: "ef7d7d" }
        };
      }
    });
},

最后吐槽一下vxe-table的操作文档，直给出了导出功能，却没有给出操作导出文件说明文档，还好我有过操作表格的经验，不至于浪费很多时间。