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

Vue3轻松实现导出Excel文件功能

文章目录

  • 1.前言
  • 2.安装插件
  • 3.案例
    • 3.1 定义表格数据,设置 id 选择器
    • 3.2 据所选 dom 对象生成 sheetbook
    • 3.3 写入文件
    • 3.4 生成 xlsx文件
  • 4.完整代码

1.前言

前端常用的导出 Exceljs 库xlsx,但是 xlsx不能设置样式。要想设置样式,必要要结合 xlsx-style 插件一起使用,但是 xlsx-style设置样式又超级麻烦。

后来又出来个 xlsx-js-style 插件,它将xlsxxlsx-style进行相结合,既能导出 Excel 基础数据,又能设置表头、单元格的样式。

所以这里我们主要选择 xlsx-js-style 这个插件导出 Excel,同时借助 file-saver 库保存文件。

2.安装插件

npm i xlsx-js-style file-saver  -S 

3.案例

3.1 定义表

相关文章:

Vue3轻松实现导出Excel文件功能

文章目录 1.前言2.安装插件3.案例3.1 定义表格数据,设置 id 选择器3.2 据所选 dom 对象生成 sheetbook3.3 写入文件3.4 生成 xlsx文件4.完整代码1.前言 前端常用的导出 Excel的 js 库是 xlsx,但是 xlsx不能设置样式。要想设置样式,必要要结合 xlsx-style 插件一起使用,但是…...

在Kali Linux中使用VNC和iptables配置xrdp以实现远程连接

在Kali Linux中,使用VNC和iptables配置xrdp以实现远程连接涉及几个步骤。不过,值得注意的是,VNC和xrdp是两种不同的远程桌面协议,它们通常不会在同一配置中同时使用(除非有特殊的网络架构需求)。然而&#…...

小徐影院:Spring Boot技术下的影院革新

第四章 系统设计 4.1 系统的功能结构图 通过系统需求分析,本小徐影城管理系统的功能结构设计如图4-1所示: 图4-1 系统功能图 4.2 系统数据库设计 4.2.1 数据库E-R图 在该系统的信息中,由于数据库的支持,我们可以对数据库进行收集…...

命名空间

在 C 中,变量、函数和类都是大量存在的,这些变量、函数和类的名称将都存在于全局作用域中,可能会导致很多冲突,使用命名空间的目的是对标识符的名称进行本地化,以避免命名冲突或名字污染,namespace 关键字的…...

使用 Elastic 将 AI 摘要添加到你的网站

作者:来自 Elastic Gustavo Llermaly 我们目前所知道的搜索(搜索栏、结果、过滤器、页面等)已经取得了长足的进步,并实现了多种不同的功能。当我们知道找到所需内容所需的关键字或知道哪些文档包含我们想要的信息时,尤…...

dOOv:Java 数据验证与映射库(简化业务逻辑)

dOOv 是一个为 Java 开发人员设计的轻量化库,专注于数据验证和对象间的映射。与传统的验证框架不同,dOOv 通过提供简洁、声明式的 API,使得开发者可以轻松地编写、扩展和维护验证和映射规则。其设计灵感源自领域驱动设计(DDD&…...

Arthas sc(查看JVM已加载的类信息 )

文章目录 二、命令列表2.2 class/classloader相关命令2.2.5 sc(查看JVM已加载的类信息 )举例1:模糊搜索,xx包下所有的类举例2:打印类的详细信息举例3:打印出类的Field信息 本人其他相关文章链接 二、命令列…...

OCR 行驶证识别 离线识别

目录 正页识别 副页识别 全部识别 OCR 行驶证识别 离线识别 正页识别 副页识别 全部识别...

PHP泛目录生成源码,可生成长尾关键词页面,带使用方法视频教程

介绍: 真正的好东西,搞网站优化seo从业必备。可以快速提升网站权重,带来的流量哗哗的 PHP泛目录生成源码 可生成新闻页面和关键词页面 带使用方法视频教程 泛目录可以用来提升网站收录和排名 合理运用目录可以达到快速出词和出权重的效果…...

LeetCode题练习与总结:丑数--263

一、题目描述 丑数 就是只包含质因数 2、3 和 5 的正整数。 给你一个整数 n ,请你判断 n 是否为 丑数 。如果是,返回 true ;否则,返回 false 。 示例 1: 输入:n 6 输出:true 解释&#xff1…...

初识C语言(五)

前言 本文章就代表C语言介绍以及了解正式完成,后续进行具体分析和详细解析学习。知识根深蒂固才可以应付后来的学习,地基要打好,后续才会轻松。 十四、结构体 结构体是C语言中最最重要的知识点,使得C语言有能力描述复杂的类型。 …...

Linux:深入理解冯诺依曼结构与操作系统

目录 1. 冯诺依曼体系结构 1.1 结构分析 1.2 存储结构分布图 2. 操作系统 2.1 概念 2.2 如何管理 2.3 什么是系统调用和库函数 1. 冯诺依曼体系结构 1.1 结构分析 不管是何种计算机,如个人笔记本电脑,服务器,都是遵循冯诺依曼结构。…...

面试中顺序表常考的十大题目解析

在数据结构与算法的面试中,顺序表是一个常见的考点。它作为一种基础的数据结构,涵盖了多种操作和概念,以下将详细介绍面试中关于顺序表常考的十大题目。 💝💝💝如果你对顺序表的概念与理解还存在疑惑&#…...

测试管理新增视图与高级搜索功能,测试计划支持一键生成缺陷详情,MeterSphere开源持续测试工具v3.3版本发布

2024年9月29日,MeterSphere开源持续测试工具正式发布v3.3版本。 在这一版本中,接口测试方面,接口导入功能支持导入Postman、JMX、HAR和MeterSphere格式的文件,接口场景的自定义请求步骤支持cURL快捷导入;测试管理方面…...

TypeScript 算法手册 【归并排序】

文章目录 1. 归并排序简介1.1 归并排序定义1.2 归并排序特点 2. 归并排序步骤过程拆解2.1 分割数组2.2 递归排序2.3 合并有序数组 3. 归并排序的优化3.1 原地归并排序3.2 混合插入排序案例代码和动态图 4. 归并排序的优点5. 归并排序的缺点总结 【 已更新完 TypeScript 设计模式…...

生信名词|MOA|基因敲低与基因敲除|DMSO|MODZ|生信基础

生信名词|MOA|基因敲低与基因敲除|DMSO|MODZ|生信基础 MOA(Mechanisms Of Action,作用机理) 过去,在药物投入到临床使用之前,它的生物学机理往往未被研究透彻。如今,随着技术的发展,一种新药物…...

基础岛第3关:浦语提示词工程实践

模型部署 使用下面脚本测试模型 from huggingface_hub import login, snapshot_download import osos.environ[HF_ENDPOINT] https://hf-mirror.comlogin(token“your_access_token")models ["internlm/internlm2-chat-1_8b"]for model in models:try:snapsh…...

vscode中配置python虚拟环境

python虚拟环境作用 Python虚拟环境允许你为每个独立的项目创建一个隔离的环境,这样每个项目都可以拥有自己的一套Python安装包和依赖,不会互相影响。实际使用中,可以在vscode或pycharm中使用虚拟环境。 1.创建虚拟环境的方法: …...

chatGPT对我学术写作的三种帮助

chatGPT对我学术写作的三种帮助 概述提高学术写作水平大模型选择概述上下文以提供精确的指令 提升同行评审优化编辑反馈 概述 从生成式人工智能中获得的价值并非来自于技术本身盲目地输出文本,而是来自于与工具的互动,并利用自身的专业知识来完善它所生…...

【PostgreSQL 】入门篇——支持的各种数据类型介绍,包括整数、浮点数、字符串、日期、JSON、数组等

1. 整数类型 1.1 SMALLINT 描述:用于存储小范围的整数值。大小:2 字节范围:-32,768 到 32,767使用场景:适合存储小型计数器、状态码等。示例: CREATE TABLE status_codes (id SMALLINT PRIMARY KEY,description TEX…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...

java调用dll出现unsatisfiedLinkError以及JNA和JNI的区别

UnsatisfiedLinkError 在对接硬件设备中,我们会遇到使用 java 调用 dll文件 的情况,此时大概率出现UnsatisfiedLinkError链接错误,原因可能有如下几种 类名错误包名错误方法名参数错误使用 JNI 协议调用,结果 dll 未实现 JNI 协…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

🌟 什么是 MCP? 模型控制协议 (MCP) 是一种创新的协议,旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议,它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

高频面试之3Zookeeper

高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个?3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制(过半机制&#xff0…...

DIY|Mac 搭建 ESP-IDF 开发环境及编译小智 AI

前一阵子在百度 AI 开发者大会上,看到基于小智 AI DIY 玩具的演示,感觉有点意思,想着自己也来试试。 如果只是想烧录现成的固件,乐鑫官方除了提供了 Windows 版本的 Flash 下载工具 之外,还提供了基于网页版的 ESP LA…...

python爬虫:Newspaper3k 的详细使用(好用的新闻网站文章抓取和解析的Python库)

更多内容请见: 爬虫和逆向教程-专栏介绍和目录 文章目录 一、Newspaper3k 概述1.1 Newspaper3k 介绍1.2 主要功能1.3 典型应用场景1.4 安装二、基本用法2.2 提取单篇文章的内容2.2 处理多篇文档三、高级选项3.1 自定义配置3.2 分析文章情感四、实战案例4.1 构建新闻摘要聚合器…...

Linux云原生安全:零信任架构与机密计算

Linux云原生安全:零信任架构与机密计算 构建坚不可摧的云原生防御体系 引言:云原生安全的范式革命 随着云原生技术的普及,安全边界正在从传统的网络边界向工作负载内部转移。Gartner预测,到2025年,零信任架构将成为超…...

LLM基础1_语言模型如何处理文本

基于GitHub项目:https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken:OpenAI开发的专业"分词器" torch:Facebook开发的强力计算引擎,相当于超级计算器 理解词嵌入:给词语画"…...

在WSL2的Ubuntu镜像中安装Docker

Docker官网链接: https://docs.docker.com/engine/install/ubuntu/ 1、运行以下命令卸载所有冲突的软件包: for pkg in docker.io docker-doc docker-compose docker-compose-v2 podman-docker containerd runc; do sudo apt-get remove $pkg; done2、设置Docker…...

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定,这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中,积分电荷法最为常用,其原理是通过测量在电容器上积累的热释电电荷,从而确定热释电系数…...