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

【日常记录】【插件】excel.js导出的时候给单元格设置下拉选择、数据校验等

news 2025/12/17 12:01:07

文章目录

    • 1. 代码基本结构
    • 2. 导出的excel 某单元格的值设置为下拉选择
    • 3. 如何把下拉选择项设置为动态
    • 4. 单元格设置校验、提示
    • 5. 在WPS上的设置

1. 代码基本结构

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://cdn.bootcdn.net/ajax/libs/exceljs/4.3.0/exceljs.min.js"></script><script src="https://cdn.bootcdn.net/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
</head>
<script>const workbook = new ExcelJS.Workbook();const worksheet = workbook.addWorksheet("导入数据明细", { properties: { tabColor: { argb: 'FFC0000' } } }); // 创建工作表const worksheet2 = workbook.addWorksheet("工作表2"); // 创建工作表worksheet.views = [{state: 'frozen',ySplit: 2,}];// 设置列worksheet.columns = [{header: "下拉选择",width: 60,}]worksheet.getCell(`A2`).dataValidation = {type: "list",allowBlank: true,formulae: ['"One,Two,Three,Four"'],// formulae: ['"' + Object.values(fieldMap.SFLogisticsType).join(",") + '"'],};workbook.xlsx.writeBuffer().then((buffer) => {const blob = new Blob([buffer], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",});let aEl = document.createElement("a");aEl.style = "display: none";aEl.download = `测试excel ${new Date().getTime()}.xlsx`;aEl.href = window.URL.createObjectURL(blob);// 创建blob 文件链接document.body.appendChild(aEl);aEl.click();document.body.removeChild(aEl);window.URL.revokeObjectURL(aEl.href); // 销毁链接}).catch((err) => {console.error(err)});</script><body></body></html>

2. 导出的excel 某单元格的值设置为下拉选择

在 excel.js 官方文档的，数据验证 文章中有详细说明

验证类型

类型描述
list定义一组离散的有效值。Excel 将在下拉菜单中提供这些内容，以便于输入
whole该值必须是整数
decimal该值必须是十进制数
textLength该值可以是文本，但长度是受控的
custom自定义公式控制有效值

运算符

对于 list 或 custom 以外的其他类型，以下运算符会影响验证：

运算符描述
between值必须介于公式结果之间
notBetween值不能介于公式结果之间
equal值必须等于公式结果
notEqual值不能等于公式结果
greaterThan值必须大于公式结果
lessThan值必须小于公式结果
greaterThanOrEqual值必须大于或等于公式结果
lessThanOrEqual值必须小于或等于公式结果
  worksheet.getCell(`A2`).dataValidation = {type: "list", // 单元格类型allowBlank: true, // 是否可以为空formulae: ['"One,Two,Three,Four"'], // 可选值};

在这里插入图片描述

现在这个样子就是这个单元格的值是下拉选择

3. 如何把下拉选择项设置为动态

一般这个下拉选择项的值，可能来源于码表，需要调接口查询，然后 设置上去

  worksheet.getCell(`A2`).dataValidation = {type: "list", // 单元格类型allowBlank: true, // 是否可以为空// formulae: ['"One,Two,Three,Four"'], // 可选值formulae: ['"' + ['小学', '中学', '大学', '研究生'].join(",") + '"'],};

要注意他这个格式

[' 逗号拼接的每一项 ']

逗号拼接的每一项，左右两边还有加上 双引号

在这里插入图片描述

4. 单元格设置校验、提示

  worksheet.getCell(`A2`).dataValidation = {type: "list", // 单元格类型allowBlank: true, // 是否可以为空// formulae: ['"One,Two,Three,Four"'], // 可选值formulae: ['"' + ['小学', '中学', '大学', '研究生'].join(",") + '"'],operator: 'equal', // 运算符showErrorMessage: true, // 如若填错是否显示错误信息errorStyle: 'error', // 错误类型errorTitle: '提示', // 错误标题error: '请选择下拉列表的项'};

如若在单元格随便输入， 就会出现这个提示
在这里插入图片描述

设置单元格提示

  worksheet.getCell(`A2`).dataValidation = {type: "list", // 单元格类型allowBlank: true, // 是否可以为空// formulae: ['"One,Two,Three,Four"'], // 可选值formulae: ['"' + ['小学', '中学', '大学', '研究生'].join(",") + '"'],operator: 'equal', // 运算符showErrorMessage: true, // 如若填错是否显示错误信息errorStyle: 'error', // 错误类型errorTitle: '提示', // 错误标题error: '请选择下拉列表的项', // 错误具体信息showInputMessage: true, // 用户输入时，是否展示提示框promptTitle: '输入提示',// 提示标题prompt: '请点击，下箭头，选择项'// 提示具体信息};

在这里插入图片描述

5. 在WPS上的设置

  1. 点击有下拉选择的单元格
  2. 点击 数据
  3. 点击有效性

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

相关文章：

【日常记录】【插件】excel.js导出的时候给单元格设置下拉选择、数据校验等

文章目录 1. 代码基本结构2. 导出的excel 某单元格的值设置为下拉选择3. 如何把下拉选择项设置为动态4. 单元格设置校验、提示5. 在WPS上的设置 1. 代码基本结构 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><…...

编程日记 2024/7/19 18:40:08

分布式 I/O 系统Modbus TCP 耦合器BL200

BL200 耦合器是一个数据采集和控制系统&#xff0c;基于强大的 32 位微处理器设计&#xff0c;采用 Linux 操作系统&#xff0c;可以快速接入现场 PLC、SCADA 以及 ERP 系统&#xff0c; 内置逻辑控制、边缘计算应用&#xff0c;支持标准 Modbus TCP 服务器通讯&#xff0c;以太…...

编程日记 2024/7/19 18:38:06

人工智能导论-机器学习

机器学习概述 概述 本章主要介绍的机器学习的概念、发展历程、发展趋势、相关应用&#xff0c;着重拓展机监督学习和无监督学习的相关知识。 重点&#xff1a;机器学习的定义和应用&#xff1b; 难点&#xff1a;机器学习算法及分类。 机器学习 - 重要性 MachineLeaning出…...

编程日记 2024/7/19 18:34:02

计算机网络——网络层（路由选择协议、路由器工作原理、IP多播、虚拟专用网和网络地址转换）

目录 路由选择协议 因特网的路由选择协议特点 路由信息协议RIP RIP衡量目的网络距离 RIP选择路由器的方式 RIP具有以下三个重要特点 RIP的基本工作流程 RIP的距离向量算法 ​编辑 ​编辑 RIP存在的问题——“坏消息传播得慢” RIP的封装 开放最短路径优先协议OSPF…...

编程日记 2024/7/19 18:33:01

对接企业微信API自建应用配置企业可信IP

前言 为了实现系统调用团队会议功能&#xff0c;组织发起企业微信会议&#xff0c;于是需要和企业微信做API对接。对接过程很难受&#xff0c;文档不清晰、没有SDK、没有技术支持甚至文档报文和实际接口报文都不匹配&#xff0c;只能说企业微信的API是从业以来见过的最难用的AP…...

编程日记 2024/7/19 18:31:59

Windows右键新建Markdown文件类型配置 | Typora | VSCode

&#x1f64b;大家好&#xff01;我是毛毛张! &#x1f308;个人首页&#xff1a; 神马都会亿点点的毛毛张 今天毛毛张分享的是如何在右键的新建菜单中添加新建MarkdownFile文件&#xff0c;这是毛毛张分享的关于Typora软件的相关知识的第三期 文章目录 1.前言&#x1f3dd;…...

编程日记 2024/7/19 18:30:59

PyTorch构建一个肺部CT图像分类模型来分辨肺癌

当你有5万个标注的肺部CT DICOM图像数据&#xff0c;并且希望使用PyTorch构建一个肺部CT图像分类模型来分辨肺癌&#xff0c;以下是详细的步骤和示例代码&#xff1a; 数据准备 首先&#xff0c;确保你的数据集被正确分为训练集、验证集和测试集&#xff0c;并且每个图像都有相…...

编程日记 2024/7/19 18:29:58

MySQL简介及数据库

mysql简介 mysql是一个轻量级关系型数据库管理系统&#xff0c;具有体积小&#xff0c;速度快&#xff0c;开源的优点 sql是一种结构化查询语言(Structured Query Language)&#xff0c;专门用来管理和处理关系型数据库的标准化编程语言&#xff0c;mysql实现了SQL标准&#xf…...

编程日记 2024/7/19 18:28:57

服务器基础1

服务器基础复习01 1.环境部署 系统&#xff1a;华为欧拉系统 网络简单配置nmtui 因为华为欧拉系统密码需要复杂度 所以我们可以进入后更改密码 echo 123 | passwd --stdin root也可以 echo "root:123" | chpasswd2.关闭防火墙&#xff0c;禁用SElinux 首先先关…...

编程日记 2024/7/19 18:27:56

＜数据集＞光伏板缺陷检测数据集＜目标检测＞

数据集格式&#xff1a;VOCYOLO格式 图片数量&#xff1a;2400张 标注数量(xml文件个数)&#xff1a;2400 标注数量(txt文件个数)&#xff1a;2400 标注类别数&#xff1a;4 标注类别名称&#xff1a;[Crack,Grid,Spot] 序号类别名称图片数框数1Crack8688922Grid8248843S…...

编程日记 2024/7/19 18:25:54

leetcode 513. 找树左下角的值

给定一个二叉树的 根节点 root&#xff0c;请找出该二叉树的 最底层 最左边 节点的值。 假设二叉树中至少有一个节点。 示例 1: 输入: root [2,1,3] 输出: 1示例 2: 输入: [1,2,3,4,null,5,6,null,null,7] 输出: 7提示: 二叉树的节点个数的范围是 [1,104]-231 < Node.val &…...

编程日记 2024/7/19 18:17:48

C++并发编程实战学习笔记

一、C的并发&#xff1a; 多进程并发&#xff1a; 将应用程序分为多个独立的进程&#xff0c;它们在同一时刻运行&#xff0c;就像同 时进行网页浏览和文字处理一样。独立的进程可以通过进程间常规的通信渠道传递讯息(信号、套接字、文件、管道等等)。不过&#xff0c;这种进程…...

编程日记 2024/7/19 18:15:45

【雷丰阳-谷粒商城 】【分布式高级篇-微服务架构篇】【25】【分布式事务】

持续学习&持续更新中… 守破离 【雷丰阳-谷粒商城 】【分布式高级篇-微服务架构篇】【25】【分布式事务】 本地事务事务的基本性质事务的隔离级别&#xff08;下面四个越往下&#xff0c;隔离级 别越高&#xff0c;并发能力越差&#xff09;事务的传播行为&#xff08;是否…...

编程日记 2024/7/19 18:14:44

HC05主从一体蓝牙模块的裸机使用——单片机＜--＞蓝牙模块

HC-05是一种常用的蓝牙模块&#xff0c;具有低功耗、低成本、易于使用的特点。它可以实现与其他蓝牙设备&#xff08;如手机、电脑等&#xff09;进行无线通信。HC-05蓝牙模块具有串口通信接口&#xff0c;可以通过串口与主控制器&#xff08;如Arduino、Raspberry Pi等&#x…...

编程日记 2024/7/19 18:12:41

“点点通“餐饮点餐小程序-计算机毕业设计源码11264

"点点通"餐饮点餐小程序 XXX专业XX级XX班&#xff1a;XXX 指导教师&#xff1a;XXX 摘要 随着中国经济的飞速增长&#xff0c;消费者的智能化水平不断提高&#xff0c;许多智能手机和相关的软件正在得到更多的关注和支持。其中&#xff0c;微信的餐饮点餐小程序更…...

编程日记 2024/7/19 18:11:40

C#知识|账号管理系统-账号信息管理界面[1]：账号分类选择框、Panel面板设置

哈喽，你好啊，我是雷工！ 前一节实现了多条件查询后端代码的编写， 接下来继续学习账号信息管理界面的功能编写，本节主要记录账号分类选择框和Panel的设置， 以下为学习笔记。 01 功能说明 本节实现以下功能： ①：账号分类选择框只能选择，无法自由输入； ②：账号分类框默认…...

编程日记 2024/7/19 18:10:39

Meta即将推出4000亿的Llama 3 超级AI模型，或将改写大语言模型竞争格局！｜TodayAI

2024年4月&#xff0c;科技巨头Meta发布了其最新的AI大型语言模型——Llama 3&#xff0c;该模型基于一个至少比前代产品Llama 2大七倍的数据集&#xff0c;展现出前所未有的性能。在最初发布时&#xff0c;Llama 3提供了8B和70B两种参数规模的版本&#xff0c;并迅速超越了Goo…...

编程日记 2024/7/19 18:09:38

数据挖掘新技能：Python爬虫编程指南

Python爬虫的优势 Python之所以成为数据爬取的首选语言&#xff0c;主要得益于其丰富的库和框架支持。以下是一些常用的库&#xff1a; Requests&#xff1a;用于发送HTTP请求&#xff0c;简单易用&#xff0c;是Python爬虫的基础库。BeautifulSoup&#xff1a;用于解析HTML文…...

编程日记 2024/7/19 18:06:32

object-C 解答算法:移动零(leetCode-283)

移动零(leetCode-283) 题目如下图:(也可以到leetCode上看完整题目,题号283) 解题思路: 本质就是把非0的元素往前移动,接下来要考虑的是怎么移动,每次移动多少? 这里需要用到双指针,i 记录每次遍历的元素值, j 记录“非0元素值”需要移动到的位置; 当所有“非0元素值”都移…...

编程日记 2024/7/19 18:04:30

靖江美食元宇宙

关于“靖江美食元宇宙”的具体信息&#xff0c;搜索结果中并未提供直接相关的详细描述。不过&#xff0c;搜索结果显示了有关元宇宙在食品领域的应用和探索&#xff0c;例如食品元宇宙的概念、不同品牌尝试进入元宇宙市场的例子等。这些信息表明&#xff0c;元宇宙技术正在被用…...

编程日记 2024/7/19 18:03:29

多模态2025：技术路线“神仙打架”，视频生成冲上云霄

文&#xff5c;魏琳华 编&#xff5c;王一粟 一场大会&#xff0c;聚集了中国多模态大模型的“半壁江山”。 智源大会2025为期两天的论坛中&#xff0c;汇集了学界、创业公司和大厂等三方的热门选手&#xff0c;关于多模态的集中讨论达到了前所未有的热度。其中&#xff0c;…...

编程新知 2025/12/9 23:28:12

C++ 求圆面积的程序（Program to find area of a circle）

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

编程新知 2025/12/10 15:23:01

使用 Streamlit 构建支持主流大模型与 Ollama 的轻量级统一平台

🎯 使用 Streamlit 构建支持主流大模型与 Ollama 的轻量级统一平台 📌 项目背景 随着大语言模型（LLM）的广泛应用，开发者常面临多个挑战： 各大模型（OpenAI、Claude、Gemini、Ollama）接口风格不统一；缺乏一个统一平台进行模型调用与测试；本地模型 Ollama 的集成与前…...

编程新知 2025/12/6 15:11:15

Docker拉取MySQL后数据库连接失败的解决方案

在使用Docker部署MySQL时&#xff0c;拉取并启动容器后&#xff0c;有时可能会遇到数据库连接失败的问题。这种问题可能由多种原因导致&#xff0c;包括配置错误、网络设置问题、权限问题等。本文将分析可能的原因&#xff0c;并提供解决方案。 一、确认MySQL容器的运行状态 …...

编程新知 2025/11/3 20:21:04

车载诊断架构 --- ZEVonUDS（J1979-3）简介第一篇

我是穿拖鞋的汉子，魔都中坚持长期主义的汽车电子工程师。 老规矩，分享一段喜欢的文字，避免自己成为高知识低文化的工程师： 做到欲望极简，了解自己的真实欲望，不受外在潮流的影响，不盲从，不跟风。把自己的精力全部用在自己。一是去掉多余，凡事找规律，基础是诚信；二是…...

编程新知 2025/12/8 0:22:42

C++ 类基础：封装、继承、多态与多线程模板实现

前言 C 是一门强大的面向对象编程语言&#xff0c;而类&#xff08;Class&#xff09;作为其核心特性之一&#xff0c;是理解和使用 C 的关键。本文将深入探讨 C 类的基本特性&#xff0c;包括封装、继承和多态&#xff0c;同时讨论类中的权限控制&#xff0c;并展示如何使用类…...

编程新知 2025/11/15 8:22:14

二叉树-144.二叉树的前序遍历-力扣(LeetCode)

一、题目解析 对于递归方法的前序遍历十分简单&#xff0c;但对于一位合格的程序猿而言&#xff0c;需要掌握将递归转化为非递归的能力&#xff0c;毕竟递归调用的时候会调用大量的栈帧&#xff0c;存在栈溢出风险。 二、算法原理 递归调用本质是系统建立栈帧&#xff0c;而非…...

编程新知 2025/12/10 13:43:07

mcts蒙特卡洛模拟树思想

您这个观察非常敏锐&#xff0c;而且在很大程度上是正确的&#xff01;您已经洞察到了MCTS算法在不同阶段的两种不同行为模式。我们来把这个关系理得更清楚一些&#xff0c;您的理解其实离真相只有一步之遥。 您说的“select是在二次选择的时候起作用”&#xff0c;这个观察非…...

编程新知 2025/10/13 22:23:18

CentOS 7.9安装Nginx1.24.0时报 checking for LuaJIT 2.x ... not found

Nginx1.24编译时&#xff0c;报LuaJIT2.x错误&#xff0c; configuring additional modules adding module in /www/server/nginx/src/ngx_devel_kit ngx_devel_kit was configured adding module in /www/server/nginx/src/lua_nginx_module checking for LuaJIT 2.x ... not…...

编程新知 2025/12/14 11:45:07

JVM——对象模型：JVM对象的内部机制和存在方式是怎样的？

引入 在Java的编程宇宙中&#xff0c;“Everything is object”是最核心的哲学纲领。当我们写下new Book()这样简单的代码时&#xff0c;JVM正在幕后构建一个复杂而精妙的“数据实体”——对象。这个看似普通的对象&#xff0c;实则是JVM内存管理、类型系统和多态机制的基石。…...

编程新知 2025/10/16 8:09:37