Vue3轻松实现导出Excel文件功能
文章目录
- 1.前言
- 2.安装插件
- 3.案例
- 3.1 定义表格数据，设置 id 选择器
- 3.2 据所选 dom 对象生成 sheetbook
- 3.3 写入文件
- 3.4 生成 xlsx文件
- 4.完整代码
1.前言
前端常用的导出 Excel的 js 库是 xlsx，但是 xlsx不能设置样式。要想设置样式，必要要结合 xlsx-style 插件一起使用，但是 xlsx-style设置样式又超级麻烦。
后来又出来个 xlsx-js-style 插件，它将xlsx 和xlsx-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 解释࿱…...
初识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…...
Python｜GIF 解析与构建（5）：手搓截屏和帧率控制
目录 Python｜GIF 解析与构建（5）：手搓截屏和帧率控制 一、引言 二、技术实现：手搓截屏模块 2.1 核心原理 2.2 代码解析：ScreenshotData类 2.2.1 截图函数：capture_screen 三、技术实现&…...
)
Java 语言特性(面试系列2)
一、SQL 基础 1. 复杂查询 （1）连接查询（JOIN） 内连接（INNER JOIN）：返回两表匹配的记录。 SELECT e.name, d.dept_name FROM employees e INNER JOIN departments d ON e.dept_id d.dept_id; 左…...
: K8s 核心概念白话解读(上)：Pod 和 Deployment 究竟是什么？)
云原生核心技术 (7/12): K8s 核心概念白话解读(上)：Pod 和 Deployment 究竟是什么？
大家好，欢迎来到《云原生核心技术》系列的第七篇！ 在上一篇，我们成功地使用 Minikube 或 kind 在自己的电脑上搭建起了一个迷你但功能完备的 Kubernetes 集群。现在，我们就像一个拥有了一块崭新数字土地的农场主，是时…...
超短脉冲激光自聚焦效应
前言与目录 强激光引起自聚焦效应机理 超短脉冲激光在脆性材料内部加工时引起的自聚焦效应，这是一种非线性光学现象，主要涉及光学克尔效应和材料的非线性光学特性。 自聚焦效应可以产生局部的强光场，对材料产生非线性响应，可能…...
通过Wrangler CLI在worker中创建数据库和表
官方使用文档：Getting started Cloudflare D1 docs 创建数据库 在命令行中执行完成之后，会在本地和远程创建数据库： npx wranglerlatest d1 create prod-d1-tutorial 在cf中就可以看到数据库： 现在，您的Cloudfla…...
` 方法)
深入浅出：JavaScript 中的 `window.crypto.getRandomValues()` 方法
深入浅出：JavaScript 中的 window.crypto.getRandomValues() 方法 在现代 Web 开发中，随机数的生成看似简单，却隐藏着许多玄机。无论是生成密码、加密密钥，还是创建安全令牌，随机数的质量直接关系到系统的安全性。Jav…...
对WWDC 2025 Keynote 内容的预测
借助我们以往对苹果公司发展路径的深入研究经验，以及大语言模型的分析能力，我们系统梳理了多年来苹果 WWDC 主题演讲的规律。在 WWDC 2025 即将揭幕之际，我们让 ChatGPT 对今年的 Keynote 内容进行了一个初步预测，聊作存档。等到明…...
Rust 异步编程
Rust 异步编程 引言 Rust 是一种系统编程语言，以其高性能、安全性以及零成本抽象而著称。在多核处理器成为主流的今天，异步编程成为了一种提高应用性能、优化资源利用的有效手段。本文将深入探讨 Rust 异步编程的核心概念、常用库以及最佳实践。 异步编程基础 什么是异步…...
鸿蒙DevEco Studio HarmonyOS 5跑酷小游戏实现指南
1. 项目概述 本跑酷小游戏基于鸿蒙HarmonyOS 5开发，使用DevEco Studio作为开发工具，采用Java语言实现，包含角色控制、障碍物生成和分数计算系统。 2. 项目结构 /src/main/java/com/example/runner/├── MainAbilitySlice.java // 主界…...
SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理）
上一章用到了V2 的概念，其实 Fiori当中还有 V4，咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)，代理中间件（ui5-middleware-simpleproxy）-CSDN博客…...