前端使用SheetJS读取表格数据

已于 2022-10-25 10:19:45 修改
阅读量892 收藏
点赞数
分类专栏： react 文章标签： 前端
于 2022-06-23 16:40:09 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ygy211715/article/details/125429877
版权

最近公司业务中有一需求，需要前端做一个上传表格并且展示表格内容，也就是需要前端读取表格内容，用到了第三方插件sheetJs

话不多说，上代码

首先，通过npm 安装插件

npm install xlsx

第二步：新建一个ts文件，因为我这里使用的是typescript+react进行的开发

list.splice(0,1)是因为这里因为自己定制表头，所以读取出来第一行是表头内容，所以最终需要去掉第一条数据

list就是最终转化的数据，对外暴露的readExcels是转换方法

ygy211715
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
js xlsx获取表头
m0_37127099的博客
06-03 2412
getHeaderRow(sheet) { const headers = [] /* sheet['!ref']表示所有单元格的范围，例如从A1到F8则记录为 A1:F8*/ const range = XLSX.utils.decode_range(sheet['!ref']) let C, R = range.s.r + 2 /* 从第一行开始 */ /* 按列进行数据遍历 */ for (C = range.s.
使用SheetJS读写Excel文件
Naisu的各种笔记
12-30 8257
项目中有一个Excel转JSON的工具，之前这个工具一直使用 Python 的 openpyxl 库来编写的，然后使用 pyinstaller 打包成 .exe 文件。之前这个工具只是个命令行工具，不带界面的。现在项目升级，打算使用Web前端方式重写这个工具，调整部分功能并新增图形界面。这篇文章中将使用 SheetJS 来操作Excel文件，对相关操作进行简单记录。
SheetJS 中文文档：强大的电子表格处理库的向导
最新发布
gitblog_00027的博客
03-27 517
SheetJS 中文文档：强大的电子表格处理库的向导 项目地址:https://gitcode.com/rockboom/SheetJS-docs-zh-CN SheetJS 是一个开源的 JavaScript 库，专为处理 Excel（.xlsx）、CSV、JSON 等各种电子表格数据格式而设计。该项目提供了详细的中文文档，便于中国开发者理解和使用。本文将深入探讨其技术特性，应用场景和优势，以期...
react-sheet:React中一个简单电子表格的库
05-02
React表 React中一个简单电子表格的库。 检出页面。 用法 function init ( ) { var element = React . createElement ( window . ReactSheet , { defaultData : [ { name : 'John' , jobTitle : 'Boss' } ] , maxRows : 2000 , columns : [ { label : 'Employee Name' , dataKey : 'name' , required : true , fixed : true , width : 150 } , { label : 'Job Title' , dataKey : 'jobTitle' , options : [ 'Boss' , 'Minion
javaScript读取excel文件中某几行的数据
热门推荐
cysisu的博客
11-23 1万+
一、介绍      这份代码借鉴了YouTube上的这个视频：https://www.youtube.com/watch?v=OK60UdWyUdE代码，讲解得很棒，让我一个不太懂javasript的小白明白了调用的机制。非常的感谢，差点我就放弃了。下面讲解下我的理解：（适合小白看，最后我会给出可以运行的文件包）       第一步：读取excel文件需要下载三个js文件：jquery-3.3...
js获取表格第一行数据（不包括表头）
helloworlddm的博客
01-10 9329
代码如下：<!DOCTYPE HTML><html> <head> <meta charset="utf-8"/> <title> table test</title> </head> <body> <table id="test" border="1px"> <tr> <
XLSX插件使用 — 导入导出(含中文表头)（React+Antd 对上传表格做数据格式验证）
Cvory
02-10 4398
ReactAntdesignXLSX由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库，功能强大，支持格式众多，支持xls、xlsx、ods(一种OpenOffice专有表格文件格式)等十几种格式。
【React】前端React 代码中预览展示excel文件
郭昊的博客
02-02 1614
【代码】前端React 代码中预览展示excel文件。
前端数据可视化echarts.js使用指南
02-24
因为公司需求上面的新颖(奇葩)的需求，让我有幸可以学习到一些好玩有趣的前端技术，前端技术中好玩而且比较实用的我想应该要数前端的数据可视化这一方面，目前市面上的数据可视化的框架琳琅满目，例如：D3.js、...
前端js解析/读取excel文件
12-22
前端js解析/读取excel文件，完整解析，简单操作，官网地址 http://oss.sheetjs.com/js-xlsx/
Js读取json数据实现滚动分页实例.rar
11-10
Js读取json数据实现滚动分页实例 Js读取json数据实现滚动分页实例 Js读取json数据实现滚动分页实例
使用 Python 读取电子表格中的数据实例详解
09-17
主要介绍了使用 Python 读取电子表格中的数据,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
10-22
主要介绍了JS读取XML文件数据并以table形式显示数据的方法,涉及javascript针对xml节点操作及HTML表格操作的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
在react中实现表格数据的导入，导出，以及“type =‘file’”按钮的样式修改
q1312882392的博客
04-30 4517
最近项目需要实现表格数据的导入导出功能，查看了很多资料，下面进行一个总结。 表格数据导入： 数据导入用的插件是：SheetJS js-xlsx；这是一款能够读写多种格式表格的插件，浏览器支持良好，并且能在多个语言平台上使用。 Github地址:https://github.com/SheetJS/js-xlsx 使用 1.安装依赖：npm install xlsx； 2.在项目中引用：import...
实现SheetJS读取excel表格数据并将表头中文转英文
alonelone的博客
04-12 670
excel中的数据批量导入的时候，针对表头做验证和中英文转换
前端js读取excel工作表格数据
weixin_45966674的博客
03-13 1252
xlsx.core.min.js 线上地址 https://cdn.bootcss.com/xlsx/0.11.5/xlsx.core.min.js。jquery.min.js 线上地址 https://cdn.bootcss.com/jquery/3.2.1/jquery.js。//给input标签绑定change事件，一上传选中的.xls文件就会触发该函数。// 表格的表格范围，可用于判断表头是否数量是否正确。//在控制台打印出来表格中的数据。// 以二进制方式打开文件。// 存储获取到的数据。
基于 SheetJS 的前端合并单元格复杂表头导入
qq_43600513的博客
04-23 1539
顶部为基于 antdv 的 table 组件的复现效果。复现 Excel 表格中，合并完单元格后的效果。table 组件用到的 columns 配置，及 dataSource 数据，均由解析函数一并返回。无需要开发者二次开发及维护。底部为解析函数解析后返回的三个数据结果。分别为解析后的 antdv columns 表格列的配置项，直接传递给 table 组件的 columns 属性使用。
前端读取Excel文件（使用js-xls插件）
young_Emily的博客
08-17 1万+
使用js-xlsx库前端读取Excel报表文件
react sheetjs
wurd的博客
02-06 572
sheetjs "xlsx": "^0.16.9" npm install xlsx import { utils, writeFile, read } from 'xlsx'; read: let file = document.getElementById("sheet").files[0]; if(file){ var reader = new FileReader(); reader.onload = e => ...
前端读取excel内容
05-12
要在前端读取Excel内容，可以使用JavaScript库如SheetJS或xlsx。以下是一个使用SheetJS的示例： 1. 首先，将sheetjs的库文件导入你的项目中。 ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值