技术学习分享_一航技术 技术资讯 #yyds干货盘点#JS 解析 excel 文件

#yyds干货盘点#JS 解析 excel 文件

广告位

JS解析excel文件分为如下几步:

  1. 使用 ​​js​​ 解压缩 ​​excel​​ 文件
  2. 获取到其中的 ​​sheet​​ 文件内容,然后将 ​​xml​​ 数据解析出来
  3. 将数据转换成我们想要的形状

ZIP 解压

关于 ​​JS​​​ 如何实现 ​​ZIP​​​ 解压的,上一篇文章也有提到,这里我们就不细说,直接使用 ​​jszip​​ 搞定:

document.querySelector('#file').addEventListener('change', async e => {
const file = e.target.files[0];
if (!file) return;
const zip = await JSZip.loadAsync(file);
const sheetXML = await zip.files['xl/worksheets/sheet1.xml'].async('string');
});
复制代码

快速搞定,现在 ​​sheetXML​​ 就是我们刚刚看到的 ​​sheet1.xml​​ 中的数据了。

XML 解析

然后我们即可解析 ​​XML​​​ 内容将其中数据取出,​​xml​​​ 解析原理很简单,和 ​​html parse​​ 一样,了解原理咱就直接随便搞个开源库帮忙搞定:

import convert from 'xml-js';

const result = convert.xml2json(sheetXML, { compact: true, spaces: 4 });
复制代码

然后我们就得到了这样一串 ​​JSON​​(删除了部分内容):

{
"_declaration": {
"_attributes": {}
},
"worksheet": {
"_attributes": {},
"sheetPr": {},
"dimension": {
"_attributes": {
"ref": "A1:C7"
}
},
"sheetData": {
"row": [
{
"_attributes": {
"r": "1",
"spans": "1:3"
},
"c": [
{
"_attributes": {
"r": "A1"
},
"v": {
"_text": "1"
}
},
{
"_attributes": {
"r": "C1"
},
"v": {
"_text": "2"
}
}
]
},
{
"_attributes": {
"r": "7",
"spans": "1:3"
},
"c": [
{
"_attributes": {
"r": "A7"
},
"v": {
"_text": "1"
}
},
{
"_attributes": {
"r": "C7"
},
"v": {
"_text": "2"
}
}
]
}
]
}
}
}

接下来,我们只需要将 ​sheetData​ 中的数据取出,然后按照内部的属性生成自己想要的数据格式即可。

本文来自网络,不代表技术学习分享_一航技术立场,转载请注明出处。

作者: 一航技术

上一篇
下一篇
广告位

发表回复

返回顶部