关于xlsx.full.js 使用 和 行高设置

参考资料:https://github.com/protobi/js-xlsx
https://blog.csdn.net/tian_i/article/details/84327329
https://blog.csdn.net/seeflyliu/article/details/109476804

单元格样式:

const cell = {
	v: '123',
	s:{
		fill:{patternType:'solid'},
		font:{italic:true},
    		alignment:{wrapText:true}
	}
}

在这里插入图片描述
在这里插入图片描述

固定表头(!freeze)

xSplit代表固定哪一列,设置为0就不生效了,不知道为什么,必须要固定一列
ySplit代表固定前几行,根据上面计算的参数headerRows来

ws["!freeze"] = {
  xSplit: "1",// 第一列
  ySplit: "" + headerRows,// headerRows是表头有几行
  topLeftCell: "B" + (headerRows + 1),
  activePane: "bottomRight",
  state: "frozen",
};

单元格列宽(!cols)
ws[’!cols’] = [{wpx:100},{wpx:200}];
合并单元格(!mergs)
s 表示 start,意思是需要合并的起始位置
e 表示 end,意思是需要合并的结束位置
r 表示 row,行下标,从0开始
c 表示 column,列下标,从0开始

ws['!merges'] = [
                {
                    s: { r: 0, c: 0 },
                    e: { r: 2, c: 4 }
                },
               {
                    s: { r: 3, c: 0 },
                    e: { r: 3, c: 4 }
                }
            ]

单元格行高(!rows)
ws[’!rows’] = [{hpt:20},{hpt:30}];
之前引用的js一直无法实现行高设置或能设置行高但单元格样式按之前来写的话样式又无法显示
在这里插入图片描述

只有行高和合并单元格有效,列宽和样式无效。

第二个版本
在这里插入图片描述
在这里插入图片描述

样式列宽等都有效但行高设置失败。

具体断点比较两个版本的xlsx.full.min.js代码发现
原版(无行高):
在这里插入图片描述

git上找到了有个版本的该方法是有加行高设置的
在这里插入图片描述

所以我试着将这段代码把原代码中该发放替换后再运行,结果是可行的。
在这里插入图片描述

分隔-------------------------------------------------------------------------------------------------------------------------------
更新2021-11-04

最近遇到用户反馈之前做的表格保留三位小数点和增加币符的字段在表格中无法进行运算
在这里插入图片描述
由于之前是在数据生成前将数字转为字符串类型,导致生成excle中改字段为文本类型。
这时想到了xlsx.js中numFmt属性,使用说明:


```javascript
sheet[cell].s = {
    numFmt : "0.000"    //"$0.00"
}

``
插入到原代码中调试结果,不管是小数点还是币符都完美解决。
注意传过来的值需要是数字类型,如果是文本类型就无效了。
在这里插入图片描述
网盘地址:
链接:https://pan.baidu.com/s/1E_vw7YAyU9GArfmgieQcfA
提取码:2uwh

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值