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

使用JavaScript和XLSX.js将数据导出为Excel文件

目录

  • 一、安装XLSX.js
  • 二、将数据转换为Excel文件

导出数据是Web应用程序中常见的功能之一。在许多情况下,我们需要将数据导出为Excel文件,以便用户可以在本地计算机上查看和编辑数据。在本篇博客中,我们将介绍如何使用JavaScript和XLSX.js将数据导出为Excel文件。

XLSX.js是一个JavaScript库,它提供了一组API,可以将数据转换为Excel文件。该库支持多种数据源,包括数组、JSON对象和CSV文件。使用XLSX.js,我们可以轻松地将数据导出为Excel文件,并在Web应用程序中提供下载链接。

在本篇博客中,我们将介绍如何使用XLSX.js将数据导出为Excel文件。我们将从安装XLSX.js开始,然后介绍如何将数据转换为Excel文件,并提供一个完整的示例,以便您可以轻松地将其集成到您的Web应用程序中。

一、安装XLSX.js

XLSX.js 是一个 JavaScript 库,可用于在浏览器中读取和写入 Excel 文件。它支持各种 Excel 文件格式,包括 .xlsx、.xlsm、.xlsb 和 .xls。XLSX.js 可以在浏览器中直接使用,也可以在 Node.js 中使用。

使用 XLSX.js,你可以将数据导出到 Excel 文件中,或从 Excel 文件中导入数据。它还提供了许多功能,例如:

  • 解析 Excel 文件中的单元格
  • 处理 Excel 文件中的日期格式
  • 读取和写入 Excel 文件中的图表和图像

要使用XLSX.js,您需要将其添加到您的项目中。您可以通过npm安装XLSX.js,也可以直接从CDN中引入它。在本篇博客中,我们将使用CDN来安装XLSX.js。

您可以通过以下代码将XLSX.js添加到您的HTML文件中:

<script src="https://cdn.jsdelivr.net/npm/xlsx@0.17.0/dist/xlsx.full.min.js"></script>

上面的代码将从CDN中加载XLSX.js的最新版本。您可以将版本号更改为您需要的版本。现在,我们已经安装了XLSX.js,可以开始导出数据了。

二、将数据转换为Excel文件

要将数据导出为Excel文件,我们需要将其转换为XLSX.js支持的格式。XLSX.js支持多种数据格式,包括数组、JSON对象和CSV文件。在本篇博客中,我们将介绍如何将数组和JSON对象转换为Excel文件。

将数组转换为Excel文件

要将数组转换为Excel文件,我们需要使用XLSX.utils.aoa_to_sheet方法将数组转换为worksheet对象,然后将worksheet对象添加到workbook中。以下是将数组转换为Excel文件的完整代码示例:

import * as XLSX from "xlsx"
const tempData = [['John Doe', 30],['Jane Doe', 25],['Bob Smith', 40]
];// 将数组中的数据转换为一个包含两个属性的对象数组const exportData = this.tempData.map(item => {return {'Name': item[0],'Age': item[1]}// 将数据转换为 worksheet 对象
const worksheet = XLSX.utils.aoa_to_sheet(exportData);// 将 worksheet 对象添加到 workbook 中
const workbook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');// 导出 Excel 文件
XLSX.writeFile(workbook, 'data.xlsx');

在上面的代码中,我们定义了一个包含数据的二维数组tempData。然后,我们使用XLSX.utils.aoa_to_sheet方法将数据转换为worksheet对象。接下来,我们创建一个新的workbook对象,并使用XLSX.utils.book_append_sheet方法将worksheet对象添加到workbook中。最后,我们使用XLSX.writeFile方法将workbook导出为Excel文件,并将其保存到本地文件系统中。

如果需要将Excel文件设置尾没有表头,即构造的数据结构没有表头,需要将header选项被设置为0。

            // 构造要导出的数据结构,不需要表头const exportData = this.tempData.map(item => {return [item[0],item[1]]})// 将数据转换为 worksheet 对象const worksheet = XLSX.utils.aoa_to_sheet(exportData, { header: 0 });            // 将 worksheet 对象添加到 workbook 中const workbook = XLSX.utils.book_new();XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');// 导出 Excel 文件XLSX.writeFile(workbook, 'test_read.xlsx');

将JSON对象转换为Excel文件

要将JSON对象转换为Excel文件,我们需要使用XLSX.utils.json_to_sheet方法将JSON对象转换为worksheet对象,然后将worksheet对象添加到workbook中。以下是将JSON对象转换为Excel文件的完整代码示例:

const data = [{name: 'John Doe',age: 30,gender: 'Male'},{name: 'Jane Doe',age: 25,gender: 'Female'},{name: 'Bob Smith',age: 40,gender: 'Male'}
];// 将数据转换为 worksheet 对象
const worksheet = XLSX.utils.json_to_sheet(data);// 将 worksheet 对象添加到 workbook 中
const workbook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');// 导出 Excel 文件
XLSX.writeFile(workbook, 'data.xlsx');

在上面的代码中,我们定义了一个包含JSON对象的数组data。然后,我们使用XLSX.utils.json_to_sheet方法将JSON对象转换为worksheet对象。接下来,我们创建一个新的workbook对象,并使用XLSX.utils.book_append_sheet方法将worksheet对象添加到workbook中。最后,我们使用XLSX.writeFile方法将workbook导出为Excel文件,并将其保存到本地文件系统中。

相关文章:

使用JavaScript和XLSX.js将数据导出为Excel文件

目录 一、安装XLSX.js二、将数据转换为Excel文件 导出数据是Web应用程序中常见的功能之一。在许多情况下&#xff0c;我们需要将数据导出为Excel文件&#xff0c;以便用户可以在本地计算机上查看和编辑数据。在本篇博客中&#xff0c;我们将介绍如何使用JavaScript和XLSX.js将数…...

如何使用YOLOv8训练自己的模型

本文介绍如何用YOLO8训练自己的模型&#xff0c;我们开门见山&#xff0c;直接步入正题。 前言&#xff1a;用yolo8在自己的数据集上训练模型首先需要配置好YOLO8的环境&#xff0c;如果不会配置YOLO8环境可以参考本人主页的另一篇文章 提醒&#xff1a;使用GPU训练会大幅度加…...

机器学习-逻辑回归【手撕】

逻辑回归 在模式识别问题中&#xff0c;所输出的结果是分类&#xff0c;比如是否是猫&#xff0c;这时候无法通过简单的线性回归来实现问题。同时&#xff0c;与线性回归不同的是&#xff0c;逻辑回归是一种名为回归的线性分类器&#xff0c;并常用于二分类&#xff0c;其本质…...

内网安全:NTLM-Relay

目录 NTLM认证过程以及攻击面 NTLM Relay攻击 NTLM攻击总结 实验环境说明 域横向移动&#xff1a;NTLM中继攻击 攻击条件 实战一&#xff1a;NTLM中继攻击-CS转发上线MSF 原理示意图 一. CS代理转发 二. MSF架设路由 三. 适用smb_relay模块进行中继攻击 域横向移动…...

Tensorflow2.0笔记 - tensor的padding和tile

本笔记记录tensor的填充和tile操作&#xff0c;对应tf.pad和tf.tile import tensorflow as tf import numpy as nptf.__version__#pad做填充 # tf.pad( tensor,paddings, modeCONSTANT,nameNone) #1维tensor填充 tensor tf.random.uniform([5], maxval10, dtypetf.int32) pri…...

多媒体测试资源

目录 简介自己整理的文件测试资源列表 简介 音视频测试时,需要许多源文件,这里整理了一些.会持续更新.当然可以使用ffmpeg转换获得需要的文件. 如果知道的这方面资源的,在评论区留言. 自己整理的文件 有视频,图片,音频. 链接&#xff1a;https://pan.baidu.com/s/1vatLmWk…...

Wordpress seo优化该怎么做?

Wordpress作为开源管理系统&#xff0c;目前已然是世界上最流行的cms之一&#xff0c;这不仅仅因为他开源&#xff0c;对用户友好&#xff0c;让任何人都能轻而易举的制作网站&#xff0c;更是因为这套程序对于搜索引擎非常友好&#xff0c;是做谷歌seo的不二之选 Wordpress作为…...

Ultraleap 3Di示例Interactable Objects组件分析

该示例代码位置如下&#xff1a; 分析如下&#xff1a; Hover Enabled&#xff1a;悬停功能&#xff0c;手放在这个模型上&#xff0c;会触发我们手放在这个模型上的悬停功能。此时当手靠近模型的时候&#xff0c;手的模型的颜色会发生改变&#xff0c;反之&#xff0c;则不会…...

Vue自定义成功弹窗H5实现类似于小程序的效果

效果图&#xff1a; <div class"father"><div class"success-box" v-if"isSuccess"><img src"../../assets/insure/success-logo.png" alt""><span>{{ successTitle }}</span></div> &…...

Linux之父:我们正在从C语言转向Rust

最近&#xff0c;Linus在“Torvalds 演讲&#xff1a;人工智能对编程的影响”&#xff1a;“我们正在从C语言转向Rust”。 网友讨论&#xff1a; Linus 选择 Rust 是因为&#xff0c;这是一个中长期解决方案&#xff0c;解决了 IT 世界中缺乏 C/C 人员的实际问题&#xff0c;所…...

C++ qt标题栏组件绘制

本博文源于笔者在学习C qt制作的标题栏组件&#xff0c;主要包含了&#xff0c;最小化&#xff0c;最大化&#xff0c;关闭。读者在看到这篇博文的时候&#xff0c;可以直接查看如何使用的&#xff0c;会使用了&#xff0c;然后进行复制粘贴源码部分即可。 问题来源 想要制作…...

Mysql运维篇(三) MySQL备份与恢复

一路走来&#xff0c;所有遇到的人&#xff0c;帮助过我的、伤害过我的都是朋友&#xff0c;没有一个是敌人。如有侵权&#xff0c;请留言&#xff0c;我及时删除&#xff01; 一、物理备份与逻辑备份 1、物理备份&#xff1a;备份数据文件&#xff0c;转储数据库物理文件到某…...

数字图像处理(实践篇)二十七 Python-OpenCV 滑动条的使用

目录 1 涉及的函数 2 实践 1 涉及的函数 ⒈ setWindowProperty()用于设置GUI应用程序的属性 cv2.setWindowProperty(windowsName, prop_id, prop_value) 参数: ①...

拷贝构造函数的理解

1.拷贝构造函数与构造函数类似&#xff0c;当没有自定义拷贝构造函数的时候&#xff0c;编译器会定义一个拷贝构造函数。 当类对象没有初始化的时候&#xff0c;通过赋值运算符的形式&#xff0c;也是调用拷贝构造函数。 Test aa(100); Test bb aa;//调用拷贝构造函数Test …...

基于ncurse的floppy_bird小游戏

1. 需求分析 将运动分解为鸟的垂直运动和杆的左右运动。 2. 概要设计 2.1 鸟运动部分 2.2 杆的运动 3. 代码实现 #include <stdio.h> #include <ncurses.h>#include <stdlib.h> #include <time.h>int vx 0; int vy 1;int bird_r; int bird_c;int…...

创建第一个 Spring 项目(IDEA社区版)

文章目录 创建 Spring 项目创建一个普通的 Maven 项目添加 Spring 依赖IDEA更换国内源 运行第一个 Spring 项目新建启动类存储 Bean 对象将Bean注册到Spring 获取并使用 Bean 对象 创建 Spring 项目 创建一个普通的 Maven 项目 首先创建一个普通的 Maven 项目 添加 Spring 依…...

VUE3动漫影视视频网站模板源码

文章目录 1.视频设计来源1.1 主界面1.2 动漫、电视剧、电影视频界面1.3 播放视频界面1.4 娱乐前线新闻界面1.5 关于我们界面 2.效果和源码2.1 动态效果2.2 源码结构 源码下载 作者&#xff1a;xcLeigh 文章地址&#xff1a;https://blog.csdn.net/weixin_43151418/article/deta…...

Node.js-express

1.了解Ajax 1.1 什么是ajax Ajax的全称是Asynchronous Javascript And XML&#xff08;异步Js和XML&#xff09;. 通俗的理解&#xff1a;在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式&#xff0c;就是Ajax 1.2 为什么要学习Ajax 之前所学的技术&#xff0c…...

心理学笔记——我们如何思考-思想、语言和手语

我们如何思考-思想、语言和手语 研究语言的理论&#xff1a;计算理论、认知神经学、进化论 当我们讨论语言时&#xff0c;指的是英语、中文、日语这样的语言系统 所有语言都共享一些深层且复杂的共性&#xff0c;最直观的就是每一种语言都能够有效地表达抽象概念——思想、物…...

Matlab处理excel数据

我们新建个excel文档&#xff0c;用Matlab读取里面的内容&#xff0c;计算和判断里面的计算结果是否正确&#xff0c;并打印到另一个文档当中。 新建文档 新建输入文档&#xff0c;文件名TestExcel 编写脚本 [num,txt] xlsread(TestExcel.xlsx); SNcode num(:,1);%从序号中…...

无机布防火卷帘门价格怎么算?按尺寸定制,按需报价

无机布防火卷帘门作为建筑防火分区的核心设备&#xff0c;价格一直是工程采购的关注重点。很多用户在询价时&#xff0c;会发现不同厂家的报价差异较大&#xff0c;这是因为无机布防火卷帘门的价格并非按统一单价计算&#xff0c;而是完全根据项目的实际需求定制化核算。 &…...

从一次生产事故复盘:我们如何优雅地处理用户上传的‘异常’Excel文件(附Apache POI配置详解)

从生产事故到防御体系&#xff1a;构建Excel文件处理的工程化解决方案那天凌晨2点&#xff0c;我被一阵急促的告警声惊醒。监控系统显示&#xff0c;核心文件处理服务的错误率在10分钟内飙升到35%&#xff0c;大量用户上传的Excel文件无法正常解析。更糟糕的是&#xff0c;部分…...

Topit:macOS窗口置顶神器,让多任务处理效率翻倍

Topit&#xff1a;macOS窗口置顶神器&#xff0c;让多任务处理效率翻倍 【免费下载链接】Topit Pin any window to the top of your screen / 在Mac上将你的任何窗口强制置顶 项目地址: https://gitcode.com/gh_mirrors/to/Topit 你是否经常在macOS上同时处理多个任务时…...

别再死记硬背了!用Multisim仿真+图解,5分钟搞懂三极管共射放大电路工作原理

用Multisim仿真图解5分钟掌握三极管共射放大电路三极管共射放大电路是电子技术中最基础也最关键的电路之一&#xff0c;但传统教材中复杂的公式推导和静态图解往往让初学者望而生畏。本文将带你用Multisim仿真软件&#xff0c;通过可视化的方式直观理解电路工作原理&#xff0c…...

手把手教你为WCH CH582移植CherryUSB主机栈(基于RT-Thread,含中断优化)

基于RT-Thread的WCH CH582 USB主机协议栈深度移植指南在嵌入式开发领域&#xff0c;USB主机功能的实现往往意味着设备能够直接连接各类USB外设&#xff0c;从简单的键盘鼠标到复杂的存储设备。对于使用WCH CH582这类RISC-V内核MCU的开发者而言&#xff0c;原厂SDK提供的USB主机…...

如何从零构建智能FOC轮腿机器人:完整开源硬件系统终极指南

如何从零构建智能FOC轮腿机器人&#xff1a;完整开源硬件系统终极指南 【免费下载链接】foc-wheel-legged-robot Open source materials for a novel structured legged robot, including mechanical design, electronic design, algorithm simulation, and software developme…...

举一个具体例子说明为什么索引不是越多越好,举具体字段

文章目录1. 核心舞台&#xff1a;笔记表 (t_note) 结构设计&#x1f6a8; 错误的操作&#xff1a;2. 结合具体字段&#xff0c;拆解三大翻车现场现场一&#xff1a;给 view_count&#xff08;浏览量&#xff09;加索引 —— 导致写放大&#xff0c;拖垮数据库现场二&#xff1a…...

阿波罗登月,不可能:读心术与影子叙事 ——不是向全世界展示登月,而是向全世界注射登月

阿波罗登月&#xff0c;不可能&#xff1a;读心术与影子叙事 ——不是向全世界展示登月&#xff0c;而是向全世界注射登月 Jianbing Zhu 1^{1}1 1^{1}1 ECT-OS-JiuHuaShan 文明实验室 ORCID: 0009-0006-8591-1891 DOI: 10.5281/zenodo.20373157 Email: ect-os-jiuhuashanzoho…...

论文写作效率翻倍?okbiye 毕业论文 AI 功能全解析:从需求到终稿的规范路径

okbiye-免费查重复率aigc检测/开题报告/毕业论文/智能排版/文献综述/AI PPT毕业论文 - Okbiye智能写作https://www.okbiye.com/ai/bylw 一、从界面看本质&#xff1a;okbiye 毕业论文 AI 写作的设计逻辑 打开 okbiye 的毕业论文 AI 写作页面&#xff0c;首先能感受到的是清晰的…...

收藏干货|2026 版企业 AI 落地实操指南,程序员小白入门避坑必备

如今人工智能早已脱离概念炒作阶段&#xff0c;全面扎根企业实际业务场景&#xff0c;成为技术从业者与企业管理者无法回避的发展课题。各行各业都加速布局AI赛道&#xff0c;行业心态也从初期观望试探&#xff0c;彻底转变为实打实的落地攻坚。 不少企业高层主动牵头统筹AI规划…...