vue 导出excel,支持单元格合并,背景色,列宽,字体大小等

小七想发言

已于 2023-03-02 09:21:04 修改

阅读量976

点赞数 2

分类专栏： vue 导出模块文章标签： vue.js node.js npm Powered by 金山文档

于 2023-02-27 11:54:37 首次发布

本文链接：https://blog.csdn.net/qq_51553392/article/details/129238988

版权

vue 导出模块专栏收录该内容

3 篇文章 0 订阅

订阅专栏

npm下载

npm i xlsx.full.min    npm i xlsx-style

关键代码如下

 downloadExl(data, name, datab) {
    const wopts = {
      bookType: 'xlsx',
      bookSST: false,
      type: 'binary'
    }; //这里的数据是用来定义导出的格式类型
    const wb = {
      SheetNames: ['Sheet1'],
      Sheets: {},
      Props: {},
      s: {}
    };
    console.log(data)
    wb.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(data); //通过json_to_sheet转成单页(Sheet)数据
    // wb.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(data); //通过json_to_sheet转成单页(Sheet)数据
    let lattice = '' //列+  行  i+1  chine_color
    let colors = {      //数据颜色转换
      white: "ffffff",
      red: "ff0000",
      yellow: "ffff00",
      gray: "808080",
      blue: "0000ff",
      green: "008000",
      purple: "800080"
    }
     if ('chine_color' in datab[0]) {
      datab.forEach((it, j) => {
        Object.keys(data[0]).forEach((_, i) => {
          lattice = exportExcel.getColName(i + 1) + (j + 2)
          wb.Sheets['Sheet1'][lattice].s = {
            fill: { //背景色
              fgColor: {
                rgb: colors[it.chine_color]
              }
            },
          }
        })
      })
    }
    exportExcel.saveAs(new Blob([
      exportExcel.s2ab(XLSXStyle.write(wb, wopts))
      // exportExcel.s2ab(XLSX.write(wb, wopts))
      // exportExcel.s2ab(wbout)
    ], {
      type: "application/octet-stream",
    }), name + '.' + (wopts.bookType == "biff2" ? "xls" : wopts.bookType));
  },