前端VUE导出excel多sheet,适用单多导出

安装

npm install --save xlsx file-savernpm install --save xlsx-style

完整代码

/* eslint-disable */import {saveAs} from 'file-saver'import XLSX from 'xlsx-style'function datenum(v, date1904) {  if (date1904) v += 1462;  var epoch = Date.parse(v);  return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);}//这个方法把单个数据与表格坐标对应，也标记了内容的类型function sheet_from_array_of_arrays(data, opts) {  var ws = {};  var range = {    s: {      c: 10000000,      r: 10000000    },    e: {      c: 0,      r: 0    }  };  for (var R = 0; R != data.length; ++R) {    for (var C = 0; C != data[R].length; ++C) {      if (range.s.r > R) range.s.r = R;      if (range.s.c > C) range.s.c = C;      if (range.e.r  {    let multiHeader = excelData.multiHeader || [], // 第二行表头      wch = excelData.wch,      describe = excelData.describe, // 最后一行设置特殊样式      header = excelData.header,// 第四行表头      sheetname = excelData.sheetname, //需要多填写一个sheet名      merges = excelData.merges || [], // 合并      autoWidth = true    /* original data */    //接口数据   包含数据首列行名    let data = [...excelData.data]    //把表头插入    data.unshift(header);    //把上面几行包含标题在内的几行合并表格的表头插入    if (multiHeader.length && multiHeader[0].length > 1) {      for (let i = multiHeader.length - 1; i > -1; i--) {        data.unshift(multiHeader[i])      }    }    ws.push(sheet_from_array_of_arrays(data))    //这里还没有去标记合并项  只是列出待合并区域为''    if (merges.length > 0) {      if (!ws[index]['!merges']) ws[index]['!merges'] = [];      merges.forEach(item => {        ws[index]['!merges'].push(XLSX.utils.decode_range(item))      })    }    if (autoWidth) {      /*设置worksheet每列的最大宽度*/      const colWidth = data.map(row => row.map(val => {        if (wch) {          return {            'wch': wch          }        } else {          /*先判断是否为null/undefined*/          if (val == null) {            return {              'wch': 12            };          }          /*再判断是否为中文*/          else if (val.toString().charCodeAt(0) > 255) {            return {              'wch': val.toString().length * 2.5 > 10 ? val.toString().length * 2.5 : 12            };          } else {            return {              'wch': val.toString().length * 2.1 > 10 ? val.toString().length * 2.1: 12            };          }        }      }))      let result = colWidth[0];      for (let i = 1; i  {        let alignment = {          horizontal: "left",          vertical: "center"        }        if (index === 0) {          alignment = {            horizontal: "center",            vertical: "center"          }        }        dataInfo[v + d].s = {          border: borderAll,          font: {            name: "微软雅黑",            sz: 10,          },          alignment: alignment        }      })      for (let j = 1; j  
使用
 
const dataList = [ {          data: [['李毅','18']], // 数据          header: [‘姓名’,'年龄'], // 头部  多表头有数据就是最后一行标题          multiHeader: [], // 多表头          merges: [], // 合并列 [A1:L1','C2:D2']          sheetname: ‘姓名’, // 工作簿名称          mch: 15 // 表格宽度}] table2excel(dataList, '列表')
 
问题
 
Can‘t resolve ‘./cptable‘ in ‘xxx\node_modules_xlsx
在vue.config.js中引入以下代码
 
configureWebpack: {    externals: {      './cptable': 'var cptable'    },  },