使用layui-exts插件实现layui数据表格导出自定义宽高

1.虽然layui下架了，去镜像网站下载他的插件Layui - 经典开源模块化前端 UI 框架layui 是一套开源的 Web UI 解决方案，其内部采用的是自身经典的模块化规范，并遵循原生 HTML/CSS/JS 的开发方式，极易上手，拿来即用。其外在极简，却又不失饱满的内在，体积轻盈，组件丰盈，从核心代码到使用方法的每一处细节都经过精心雕琢，非常适合网页界面的快速开发。https://layui.11dz.cn/

 找到

然后你在他码云仓库里下载layui-exts放在项目里

ok，步入正题

2.引入插件，如果使用layui框架的话：

  layui.config({
        base: '../layui/layui_exts/', // 配置一个可访问地址，我的我放在layui文件夹下
    }).extend({
        excel: 'excel',
    });
 layui.use(['table', 'jquery','excel'], function () {
        var table = layui.table;
        var layer = layui.layer;
        var $ = window.$ = layui.jquery;
        var $=layui.$=window.$;
         var excel = layui.excel;//这个是一定要写的


         //重写layui导出默认事件
  tb = table.render({
            elem: '#test'
            // , url: ur
            , data: shu
            ,toolbar:true
            , height: 'full-20'  /*高度自适应*/
            , cellMinWidth: 80    /*宽度自适应*/
            ，defaultToolbar:['filter',{ //看这就是重写了
                title:'导出',
                layEvent:'exportSelf',
                icon:'layui-icon-export'
            },'print']
            , title: '用户数据表'
            , page: true
            , limit: Number.MAX_VALUE
            , done: function (res, curr, count) {// 表格渲染完成之后的回调
                tableDate=res.data;//定义一个全局变量接收当前表格数据，后面会用到
                });
            }
            , id: 'demo'
        });
table.on('toolbar(test)', function (obj) {
            switch (obj.event) {
                case 'exportSelf':
                function gen(){//生成大写之母
                    var str = [];
                    for(var i=65;i<93;i++){
                        str.push(String.fromCharCode(i));
                    }
                    return str;
                }
                    var closO={
                        first_level: "一级",
                        second_level: "二级"
                    }
                    var excels = new Map()//行
                    var excels2 = new Map()//列
                    var str=gen()//
             
                    var clos= [
                        'first_level', 'second_level'
                    ] //定义你要导出的列头

                    for (let i=0;i<=closO.length;i++){//为了动态给每个单元格宽赋值 ，高的话也是一样的
                        if (isNaN(parseInt($('[data-field="'+clos[i]+'"]').css("width")))){
                            break;
                        }else {
                            excels2.set(str[i]+'',parseInt($('[data-                            field="'+clos[i]+'"]').css("width")))
                        }
                    }
                    var obj2= Object.create(null);//列宽，将map集合转化为对象
                    for (let[k,v] of excels2) {
                    obj2[k] = v;
                }

                    tableDate.unshift(closO)
                    //得到所有学院情况
                    console.log(closO)
                    var colConfig=  excel.makeColConfig({...obj2}, 90);//直接写对象会错我也不知道为啥
                   // var rowConfig = excel.makeRowConfig({...obj}, 80);
                   let dat = excel.filterExportData(tableDate, clos);//筛选你要的列，tableDate为layui数据表格里面所有值
                    layui.excel.setExportCellStyle(dat,'',{//设置样式 1.数据 2.range 默认到最后 3.样式配置
                        s: {
                            alignment: {
                                horizontal: 'center',//文字垂直方向
                                vertical: 'center',//水平方向
                                wrapText:true //单元格文本换行
                            }
                        }
                    });
                    layui.excel.exportExcel(dat, '考核表.xlsx', 'xlsx',{//都懂吧
                        extend: {
                            '!cols': colConfig//载入配置
                           // '!rows': rowConfig
                        }
                    })

                    break
            }
        })

//我用对象呢只是再凑他的格式
//官方格式是： var colConfig=  excel.makeColConfig({'A':80}, 90);就是A这列宽为80，其他的为//90
//var rowConfig = excel.makeRowConfig({1:60,2:50}, 80);为行设置高度第一1行60，第二行：50其他行80
点击layui小图标就完成了

});