layui实现Excel导出时,根据数据长度自动生成列名

本文介绍了一种方法,通过定义get_excel_column函数,根据数据字段长度动态生成列名,并使用excel.setExportCellStyle设置表头和单元格样式,简化了Excel导出时的样式管理过程。
摘要由CSDN通过智能技术生成

在导出Excel时,想要设置不一样的表头样式以及自定义的单元格样式,每次都需要手动去数,赋值再去设置样式很麻烦,如果每次都会根据数据字段的长度自动生成对应的列名岂不是很方便?

例如,有一份数据,长度为5,每一条记录里有5个栏位,就需要自动为 A B C D E 列设置样式

实现思想:

一、定义通用方法 get_excel_column 将导出数据data作为参数传递过来

function get_excel_column (data) {}

二、获取data栏位的个数

随机取data中某一条数据,通过Object.keys()方法,取出key值,key值的个数即使Excel栏位的个数

var code=Object.keys(data[0])

三、定义26个英文字母并生成列名

// 构建字典,便于查询
    const num_set = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("");
    var colList = [];
    for(var key=1;key<=code.length;key++){
        // 存放结果
        var result = [];
        // 初始化数据
        var num = key;
        var index;
        // 循环判断,并在结果列前插入,直到小于等于26再退出循环
        while(num > 26) {
            index = num % 26;
            num = Math.floor(num / 26);
            if (index === 0) {
                result.unshift(num_set[25]);
                num = num-1;
            } else {
                result.unshift(num_set[index-1]);
            }
        }
        // 将最后一个值插入
        result.unshift(num_set[num-1]);
        // 存放字符串结果
       colList.push(result.join(""))
    }

 四、get_excel_column完整代码

function get_excel_column (data) {
    var code=Object.keys(data[0])
    // 构建字典,便于查询
    const num_set = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("");
    var colList = [];
    for(var key=1;key<=code.length;key++){
        // 存放结果
        var result = [];
        // 初始化数据
        var num = key;
        var index;
        // 循环判断,并在结果列前插入,直到小于等于26再退出循环
        while(num > 26) {
            index = num % 26;
            num = Math.floor(num / 26);
            if (index === 0) {
                result.unshift(num_set[25]);
                num = num-1;
            } else {
                result.unshift(num_set[index-1]);
            }
        }
        // 将最后一个值插入
        result.unshift(num_set[num-1]);
        // 存放字符串结果
       colList.push(result.join(""))
    }
    return colList
  }

五、通过excel.setExportCellStyle方法设置样式

var colList=get_excel_column(data)
//标题范围
var round=colList[0]+'1:'+colList[colList.length-1]+'1'
//单元格范围
var dataRound=colList[0]+'2:'+colList[colList.length-1]+data.length
//表头样式
excel.setExportCellStyle(data,round,{
    s:{
        fill: { patternType:"solid", bgColor: { indexed: 64 }, fgColor: { rgb: "ccff99" }},
        border:{
             top:{ style: "thin" },
             bottom:{ style: "thin"},
             left:{ style: "thin"},
             right:{ style: "thin"}
        },
        alignment: {
             horizontal: 'center',
             vertical: 'center',
             wrapText:true //单元格文本换行
         }
    }
})
//单元格样式
excel.setExportCellStyle(data,dataRound,{
    s:{
        fill: { patternType:"solid", bgColor: { indexed: 64 }, fgColor: { rgb: "ffffff" }},
        border:{
             top:{ style: "thin" },
             bottom:{ style: "thin"},
             left:{ style: "thin"},
             right:{ style: "thin"}
        },
        alignment: {
             horizontal: 'center',
             vertical: 'center',
             wrapText:true //单元格文本换行
         }
    }
})                         

六、最终结果

 

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值