前端表格解析方法

工具类文件

// fileUtils.tsimport { ref } from 'vue';
import * as xlsx from 'xlsx';interface RowData {[key: string]: any;
}export const tableData = ref<RowData[]>([]);export async function handleFileSelect(url: string): Promise<void> {try {const response = await fetch(url);const blob = await response.blob();const reader = new FileReader();reader.onload = (e: ProgressEvent<FileReader>) => {if (e.target && e.target.result) {const data = new Uint8Array(e.target.result as ArrayBuffer);const workbook = xlsx.read(data, { type: 'array' });const worksheet = workbook.Sheets[workbook.SheetNames[0]];const jsonData = xlsx.utils.sheet_to_json(worksheet, { header: 1 }) as any[][];// 提取标题并保持其顺序const headers = jsonData[0];console.log('Extracted Headers:', headers);// 处理行(从索引1开始跳过标题)jsonData.slice(1).forEach((row) => {const rowData: RowData = {};headers.forEach((header, index) => {rowData[header] = row[index];});tableData.value.push(rowData);});console.log('Processed Table Data:', tableData.value);}};reader.readAsArrayBuffer(blob);} catch (error) {console.error('获取或读取文件时出错:', error);}
}

调用方法

const url ='https://xxxxx.xlsx';await handleFileSelect(url);

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/380465.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数字通云平台 智慧政务OA PayslipUser SQL注入漏洞复现

0x01 产品简介 数字通云平台智慧政务OA产品是基于云计算、大数据、人工智能等先进技术,为政府部门量身定制的智能化办公系统。该系统旨在提高政府部门的办公效率、协同能力和信息资源共享水平,推动电子政务向更高层次发展。 0x02 漏洞概述 数字通云平台 智慧政务OA Paysli…

使用shedlock实现分布式互斥执行

前言 前序章节&#xff1a;springboot基础(82):分布式定时任务解决方案shedlock 如果你不清楚shedlock&#xff0c;建议先阅读前序章节&#xff0c;再来查看本文。 如果我们不在spring环境下&#xff0c;如何使用shedlock实现分布式互斥执行&#xff1f; 我们可以使用shedl…

verilog实现ram16*8 (vivado)

module ram_16x2 (input clk, // 时钟信号input we, // 写使能input en, // 使能信号input [3:0] addr, // 地址线input [1:0] datain, // 输入数据线output reg [1:0] dataout // 输出数据线 );// 定义存储器数组reg [1:0] mem [15:0];always (posedge…

知迪科技发布了全新软件产品

近日&#xff0c;知迪科技发布了全新软件产品——Vehicle Bus Tool-Trace Version免费版。该软件产品能高效的离线分析汽车总线数据&#xff0c;并拥有一大亮点功能&#xff1a;Ethernet通信离线文件基于ARXML文件的信号级解析&#xff0c;具体操作如下&#xff1a; 1、新建一…

达梦数据库 MPP集群搭建(带主备)

MPP集群搭建&#xff08;带主备&#xff09; 1.背景2.操作内容和要求3. 具体步骤3.1 搭建过程3.1.1 集群搭建3.1.2 准备工作3.1.2.1 初始化3.1.2.2 备份数据库 3.1.3 配置主库EP013.1.3.1 配置dm.ini3.1.3.2 配置dmmal.ini3.1.3.3 配置dmarch.ini3.1.3.4 配置dmmpp.ctl3.1.3.5 …

PHP基础语法(一)

一、初步语法 1、PHP代码标记&#xff1a;以 <?php 开始&#xff0c;以 ?> 结束&#xff1b; 2、PHP注释&#xff1a;行注释&#xff1a;//&#xff08;双斜杠&#xff09;或# 块注释&#xff1a;/* */ 3、PHP语句分隔符&#xff1a; 1&#xff09;在PHP中&#…

Golang|Shopee一面

1、一个有环的链表&#xff0c;如何确认链表有环&#xff0c;环的长度。 LeetCode 142。原题为判断链表是否有环&#xff0c;如果有环找到环的起点。本题修改为求环的长度&#xff0c;基本思路一致&#xff0c;依然为双指针。当快慢指针相遇之后&#xff0c;如果寻找环的起点&…

防火墙内容安全综合实验

一、实验拓扑 二、实验要求 1&#xff0c;假设内网用户需要通过外网的web服务器和pop3邮件服务器下载文件和邮件&#xff0c;内网的FTP服务器也需要接受外网用户上传的文件。针对该场景进行防病毒的防护。 2&#xff0c;我们需要针对办公区用户进行上网行为管理&#xff0c;要…

【LeetCode】翻转二叉树

目录 一、题目二、解法完整代码 一、题目 给你一棵二叉树的根节点 root &#xff0c;翻转这棵二叉树&#xff0c;并返回其根节点。 示例 1&#xff1a; 输入&#xff1a;root [4,2,7,1,3,6,9] 输出&#xff1a;[4,7,2,9,6,3,1] 示例 2&#xff1a; 输入&#xff1a;root…

数据可视化配色新工具,颜色盘多达2500+类

好看的配色,不仅能让图表突出主要信息,更能吸引读者,之前分享过很多配色工具,例如, 👉可视化配色工具:颜色盘多达3000+类,数万种颜色! 本次再分享一个配色工具pypalettes,颜色盘多达2500+类。 安装pypalettes pip install pypalettes pypalettes使用 第1步,挑选…

1.17、基于竞争层的竞争学习(matlab)

1、基于竞争层的竞争学习简介及原理 竞争学习是一种无监督学习方法&#xff0c;其中的竞争层神经元之间互相竞争以学习输入模式的表示。竞争学习的一个经典模型是竞争神经网络&#xff08;Competitive Neural Network&#xff0c;简称CNN&#xff09;&#xff0c;其核心部分是…

【JavaScript 算法】拓扑排序:有向无环图的应用

&#x1f525; 个人主页&#xff1a;空白诗 文章目录 一、算法原理二、算法实现方法一&#xff1a;Kahn算法方法二&#xff1a;深度优先搜索&#xff08;DFS&#xff09;注释说明&#xff1a; 三、应用场景四、总结 拓扑排序&#xff08;Topological Sorting&#xff09;是一种…

《汇编语言 基于x86处理器》- 读书笔记 - Visual Studio 2019 配置 MASM环境

安装 Visual Studio 2019 配置 MASM环境 下载 Visual Studio Installer安装 Visual Studio 20191. 双击运行2. 自定义安装内容3. 修改 MSVC 工具集版本4. 设置主题&#xff08;可选&#xff09;5. 安装代码高亮插件 AsmDude&#xff08;可选&#xff09;6. 通义灵码&#xff08…

2024年第二季度 DDoS 威胁趋势报告

2024 年上半年&#xff0c;Cloudflare 缓解了 850 万次 DDoS 攻击&#xff1a;第一季度 450 万次&#xff0c;第二季度 400 万次。总体而言&#xff0c;第二季度 DDoS 攻击数量环比下降了 11%&#xff0c;但同比增长了 20%。 DDoS 攻击分布&#xff08;按类型和手段&#xff09…

面试官听了我说的单例设计模式,让我出门右转

⭐简单说两句⭐ ✨ 正在努力的小叮当~ &#x1f496; 超级爱分享&#xff0c;分享各种有趣干货&#xff01; &#x1f469;‍&#x1f4bb; 提供&#xff1a;模拟面试 | 简历诊断 | 独家简历模板 &#x1f308; 感谢关注&#xff0c;关注了你就是我的超级粉丝啦&#xff01; &a…

Go语言之参数传递

文章收录在网站&#xff1a;http://hardyfish.top/ 文章收录在网站&#xff1a;http://hardyfish.top/ 文章收录在网站&#xff1a;http://hardyfish.top/ 文章收录在网站&#xff1a;http://hardyfish.top/ 修改参数 假设你定义了一个函数&#xff0c;并在函数里对参数进行…

机器人开源调度系统OpenTcs6-架构运行分析

系统启动 启动 Kernel&#xff1a;加载核心应用&#xff0c;初始化系统配置和状态。 启动 Plant Overview&#xff1a;加载图形用户界面&#xff0c;初始化模型和用户界面。 模型导入和配置 在 Plant Overview 中导入或创建工厂布局模型。 配置路径、位置和车辆信息。 车辆连…

C语言 | Leetcode C语言题解之第240题搜索二维矩阵II

题目&#xff1a; 题解&#xff1a; bool searchMatrix(int** matrix, int matrixSize, int* matrixColSize, int target){int i 0;int j matrixColSize[0] - 1;while(j > 0 && i < matrixSize){if(target < matrix[i][j])j--;else if(target > matrix[…

达梦数据库的系统视图v$mal_link_status

达梦数据库的系统视图v$mal_link_status 在达梦数据库&#xff08;DM Database&#xff09;中&#xff0c;V$MAL_LINK_STATUS 是一个动态性能视图&#xff08;Dynamic Performance View&#xff09;&#xff0c;用于显示MAL&#xff08;Multi-threaded Architecture Link&…

cs224w笔记(p5)

链接预测任务的两种类型&#xff1a;随机缺失边&#xff1b;随时间演化边。 第一种假设可以以蛋白质之间的交互作用举例&#xff0c;缺失的是研究者还没有发现的交互作用。 第二种假设可以以社交网络举例&#xff0c;随着时间流转&#xff0c;人们认识更多朋友。 基于相似性进…