xlsx的单元格修改，获取当前单元格的数据类型

xlsx.js的单元格修改，获取当前单元格的数据类型

找遍全网没有找到xlsx.js,本地文件读取时获取当前单元格的类型，对特殊类型单元格进行修改的格式化的方法，因为我们需求是一个没有固定模板的Excel文件要对时间进行处理，其余保留原始值；

代码内容

1.先拿到文件对象，用FileReader方法获取到文件的对象

const fileRead = (files) => {return new Promise((resolve) => {// eslint-disable-next-line new-capconst filer = new FileReader();filer.readAsBinaryString(files);filer.onload = (ev) => {resolve(ev);};});
};

2.写一个获取文件内的内容和头部的一个公用方法

export const excelToArray = async (file) => {const cont = await fileRead(file);// 返回promise的文件处理函数返回二进制数据const data = cont.target.result;const workbook = XLSX.read(data, {// 将二进制数据放入得到excel数据type: "binary",cellDates: true //规定时间进行处理成日常的时间格式});const wsname = workbook.SheetNames[0]; // 取第一张表const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]); // 生成json表格内容console.log('格式化后', ws);// 获取表头2-1const a = workbook.Sheets[workbook.SheetNames[0]];console.log('未进行格式化', a);const contents = getRow(a) // 获取内容的方法![在这里插入图片描述](https://img-blog.csdnimg.cn/68977dc495244775bbd8aaaefe7ce608.png#pic_center)const headers = getHeaderRow(a); // 获取头部的方法return {headers: headers,ws: ws,contents};
};

直接用XLSX.utils.sheet_to_json() 方法无法满足需求

3.自己写了一个方法获取到了文件的，单元格格式后进行处理

const getRow = (sheet) => {const contents = [];/* sheet['!ref']表示所有单元格的范围，例如从A1到F8则记录为 A1:F8*/// c 表示列，r表示行，从0开始的const range = XLSX.utils.decode_range(sheet["!ref"]);// console.log('range', XLSX.utils.decode_range);let C,R = range.s.r; /* 从第一行开始 *//* 按列进行数据遍历 */let i = 0;for (let mr = range.s.r + 1; mr <= range.e.r; ++mr) {// 便利行来查找contents[mr - 1] = {}for (C = range.s.c; C <= range.e.c; ++C) {let obj = {}/*固定 查找第一行中的单元格 */const cell = sheet[XLSX.utils.encode_cell({c: C,r: R})];const name = XLSX.utils.format_cell(cell) // 键名/* 查找对应行内的单元格内容 */const cellCur = sheet[XLSX.utils.encode_cell({c: C,r: mr})];if (!cellCur) {contents[mr - 1][name] = {value: '',type: ''}} else {const nameCur = XLSX.utils.format_cell(cellCur) // 键名contents[mr - 1][name] = {value: cellCur.v || '',type: cellCur.t || ''}}}}return contents;
};

处理完成后的数据

表头的处理方法

/*** 将File文件通过xlsx读取表头为数组* @param file* @return {list}*/
export const getHeaderRow = (sheet) => {const headers = [];/* sheet['!ref']表示所有单元格的范围，例如从A1到F8则记录为 A1:F8*/const range = XLSX.utils.decode_range(sheet["!ref"]);let C,R = range.s.r; /* 从第一行开始 *//* 按列进行数据遍历 */let i = 0;for (C = range.s.c; C <= range.e.c; ++C) {/* 查找第一行中的单元格 */const cell = sheet[XLSX.utils.encode_cell({c: C,r: R})];let hdr = "UNKNOWN " + C; // <-- 进行默认值设置if (cell && cell.t) hdr = XLSX.utils.format_cell(cell);if (hdr.indexOf("UNKNOWN") > -1) {if (!i) {hdr = "__EMPTY";} else {hdr = "__EMPTY_" + i;}i++;}headers.push(hdr);}return headers;
};

vue xlsx.js获取单元格数据类型的hooks 单元格类型处理相关推荐

vue 和 js 获取 dom节点下的某个元素，然后设置样式
vue获取dom节点下的类名,然后修改样式 <div ref="divRef"><div class="a">提到岁月,你们总说它是长河 ...
vue 创建图片坐标点_利用vue+fabric.js获取图片坐标，并实现图片拖拽、旋转、拉伸等功能...
什么是Fabric.js? Fabric.js是一个可以简化Canvas程序编写的库. Fabric.js为Canvas提供所缺少的对象模型, svg parser, 交互和一整套其他不可或缺的工具. ...
vue js获取手机系统型号、版本、浏览器类型
1.index.html引入 <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script ...
js获取mysql数据库数据类型_怎么利用JS将从数据库中读取出来的日期型格式化为想要的类型...
在页面初始化时,用JavaScript将从数据库中读取出来的日期型格式化为想要的类型.格式化为yyyy年MM月dd日 HH时mm分ss秒,大家可以参考下代码,自由发挥下. 代码如下://传入从数据库中 ...
js把vue转化html,将 vue.js 获取的 html 文本转化为纯文本
我存入数据表中的数据是使用 html 格式,获取数据是使用 vue 获取. 遇到了一个问题,就是界面上显示的数据是 html 格式的,但是我需要它显示纯文本. 怎么做呢?首先在 js 中写一个将 ...
vue.config.js配置
原作者项目地址:https://github.com/staven630/vue-cli3-config const path = require("path"); const w ...
html如何取单元格内容,JS获取表格内指定单元格html内容的方法
JS获取表格内指定单元格html内容的方法本文实例讲述了JS获取表格内指定单元格html内容的方法.分享给大家供大家参考.具体如下: 下面的代码先通过表格对象的rows获得指定的行的所有单元格数组, ...
vue + xlsx 动态生成Excel，合并单元格
根据数据动态生成一个Excel导出文件,这个公共相对简单一些,引入 xlsx就可以了. 但是根据需求,动态合并单元格,貌似难度不小,这里需要对 xlsx的属性和方法有一定的了解才可以,那么一起学习一下 ...
给第一行单元格赋值WPS JS获取工作表的总行数WPS JS获取工作表的总行数
戳我,了解更多相关办公的小技巧给第一行单元格赋值 1.在计算机中有一种ASCII编码,其中A在计算机中的表示的数字是65,a的ascii码是97,b的ascii码是98. 2.从A1到F1可以看到第 ...

vue xlsx.js获取单元格数据类型的hooks 单元格类型处理

xlsx.js的单元格修改，获取当前单元格的数据类型

代码内容

处理完成后的数据

表头的处理方法

vue xlsx.js获取单元格数据类型的hooks 单元格类型处理相关推荐

最新文章

热门文章