当前位置: 首页 > news >正文

前端将xlsx转成json

  1. 第一种方式,用js方式
    1.1先安装插件
    万事都离不开插件的支持首先要安装两个插件

1.2. 安装xlsx

cnpm install xlsx --save

注:这块我用的cnpm,原生的是npm,因为镜像的问题安装了cnpm,至于怎么装网上一搜一大堆

1.3安装js doc插件
安装js doc插件。在vscode的插件管理,搜索Add jsdoc comments,然后安装就可以
注:这个插件是给vscode写js代码时提示用的,新手建议装一下,老鸟的话你随便

1.4.写上传文件的按钮
我这块儿没用element plus,后边第二种方式会用
样式这块用的js

  <div><span><el-icon class="el-icon--upload"><upload-filled /></el-icon><input type="file" @change="handleChange"></span></div>

1.5.逻辑代码,每一行都有注释

import * as XLSX from "xlsx"const handleChange = (e) => {// 得到上传文件的信息let fileObj = e.target.files[0]// console.log(fileObj)// FileReader 对象是专门操作二进制数据的,主要用于将文件内容读入内存当中const fileReader = new FileReader()// 将文件内容读成二进制数据放到内存当中fileReader.readAsArrayBuffer(fileObj)// 读取文件的内容fileReader.onload = (event) =>{// 读进来之后是一个二进制文件const fileData = event.target.result;// 用XLSX以二进制的方式取出电子表格字节中的数据const workbook = XLSX.read(fileData,{type:"binary",})// 按选项卡顺序列出工作表名称,也就是工作簿的名称,const wsname = workbook.SheetNames[0];// console.log(wsname)// 从工作表创建JS值数组并解析成json数据const sheetJson = XLSX.utils.sheet_to_json(workbook.Sheets[wsname])console.log(sheetJson)}
}

1.6.别看广告看疗效,上图
在这里插入图片描述
2.第二种方式就是哪种第二种方式

http://www.lryc.cn/news/364958.html

相关文章:

  • 使用LLaMA-Factory微调大模型
  • C语言二级指针、指针数组
  • python方法
  • 0基础学习区块链技术——去中心化
  • 索引的强大作用和是否创建的索引越多越好
  • 批量GBK转UTF-8
  • C#WPF数字大屏项目实战08--生产量/良品统计
  • 22、matlab锯齿波、三角波、方波:rectpuls()函数/sawtooth()函数/square()函数
  • 手机和WINDOWS电脑蓝牙连接后怎样放歌,无法选择媒体音频 蓝牙媒体音频勾选不上
  • MatrixOne→MatrixOS:矩阵起源的创业史即将用“AI Infra”和“AI Platform”书写新章程
  • vue3将自定义组件插入指定dom
  • flutter封装日历选择器(单日选择)
  • SwiftUI调用相机拍照
  • elasticsearch (dsl)
  • 聊聊大模型微调训练全流程的思考
  • Python变量符号:深入探索与实用指南
  • 实验八 页面置换模拟程序设计
  • Spring类加载机制揭秘:深度解析“卸载”阶段
  • Jupyter Notebook快速搭建
  • Linux C语言:数组的定义和初始化
  • spring框架限制接口是否要登录过才能访问
  • 【全开源】废品回收垃圾回收小程序APP公众号源码PHP版本
  • 勒索软件分析_目标文件扫描行为分析
  • 2024050401-重学 Java 设计模式《实战代理模式》
  • HTML跨年烟花
  • 微服务第二轮
  • 线性模型-分类
  • OpenAI前董事会成员称Sam Altman因 “ 向董事会撒谎 ” 而被解雇
  • 【启明智显分享】WIFI6开发板ZX6010:开源OpenWrt SDK,接受定制!
  • C语言能否使⽤ fflush( ) 函数清除多余的输⼊?