SheetJS/js-xlsx修改表头
sheetjs
📗 SheetJS Spreadsheet Data Toolkit -- New home https://git.sheetjs.com/SheetJS/sheetjs
项目地址:https://gitcode.com/gh_mirrors/sh/sheetjs
免费下载资源
·
SheetJS/js-xlsx修改表头
我们经常使用到json_to_sheet
方法将json数据转化到worksheet(表示excel文件中的一个表)中,最后导出excel表,列头会默认采用数据的键名,但是为了方便查看数据需要一个对应的中文表头。
const data = [
{
name: 'jzx',
age: 17
},
{
name: 'wmp',
age: 17
}
]
const fields = [ 'name', 'age' ]
const workSheet = XLSX.utils.json_to_sheet(
data,
{
header: fields
}
)
console.log(workSheet)
:
可以看到对象的每个属性名都很有规律,都是字母
+数字
的组合,字母
表示列,数字
表示行,行从1
开始计数,列
从字母A
开始,直到Z
,超出的依次在后面叠加字母,也就是说第27
列应该用字母AA
表示,以此类推。
属性值中t
表示类型,v
是原始值。可以看到的是列表头会用第一行来表示,也就是A1,B1
,表头加两行数据,总共3行。
你可以直接替换A1,B1
对应的表头名称,但是这在列数增加到几十个的时候很麻烦,对于这样的规律数据用一个循环来处理最好了。
首先需要拿到所有列的字母
,得到所有列以后,依次后面加1
就是所有的表头字段,然后替换属性值里的v
属性即可,这里要用到XLSX.utils.encode_col
和XLSX.utils.decode_range
方法,以及workSheet
的!ref
属性。
先来看看workSheet
的!ref
属性:
workSheet['!ref'])
// A1:B3
// 冒号前是第一个单元格,冒号后是最后一个单元格
XLSX.utils.decode_range
方法可以将对应的字母转化为数字:
const range = XLSX.utils.decode_range(ws['!ref'])
// range对象的值:
{
s: {
c: 0, // 第一行
r: 0 // 第一列
},
e: {
c: 1, // 第二列
r: 2 // 第三行
}
}
s
指的是第一个单元格,c
是指列,r
是指行,e
是最后一个单元格,ok,有了这个对象,我们就知道了这个workSheet
的所有列是从数字0
到数字1
对应的所有字母,最后使用XLSX.utils.encode_col
方法,将数字转换为对应的字母就好了,example:
XLSX.utils.encode_col(0) // A 第一列
XLSX.utils.encode_col(26) // AA 第26列
XLSX.utils.encode_col(27) // AB
最后封装一个完整的方法设置表头:
// 创建一个worksheet,创建过程中设置表头
function createWs(data, fields, titles) {
const ws = XLSX.utils.json_to_sheet(
data,
{
header: fields
}
)
const range = XLSX.utils.decode_range(ws['!ref'])
for(let c = range.s.c; c <= range.e.c; c++) {
const header = XLSX.utils.encode_col(c) + '1'
ws[header].v = titles[ ws[header].v ]
}
return ws
}
const titles = {
name: '姓名',
age: '年龄'
}
const fields = [ 'name', 'age' ]
const data = [
{
name: 'jzx',
age: 17
},
{
name: 'wmp',
age: 17
}
]
const ws = createWs(
data,
fields,
titles
)
console.log(ws)
表头已经修改好了。
GitHub 加速计划 / sh / sheetjs
34.82 K
8 K
下载
📗 SheetJS Spreadsheet Data Toolkit -- New home https://git.sheetjs.com/SheetJS/sheetjs
最近提交(Master分支:2 个月前 )
3f44ddd9 - 9 个月前
5b4806bf - 1 年前
更多推荐
已为社区贡献1条内容
所有评论(0)