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

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

news 文章来源：https://blog.csdn.net/qq_45634593/article/details/140516595 2024/11/20 7:26:08

文章目录

    • 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

模板方法设计模式

模板方法设计模式: 模板方法设计模式&#xff1a;解决方法中存在重复代码的问题。 模板方法设计模式的写法&#xff1a; 1、定义一个抽象类 2、在里面定义2个方法 ​ 一个是模板方法&#xff1a;把相同代码放里面去 ​ 一个是抽象方法&#xff1a;具体实现交给子类完成 建议使用…...

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

对象存储解决方案：高性能分布式对象存储系统MinIO

文章目录 引言I 自动化数据管理界面1.1 图形用户界面：GUI1.2 命令行界面：MinIO CLI1.3 应用程序编程接口：MinIO APIII 部署集成2.1 建议使用RPM或DEB安装方式2.2 创建环境变量文件2.3 启动MinIO服务2.4 将NGINX用作反向代理，配置负载。III 基础概念3.1 为什么是对象存储？3…...

编程日记 2024/7/19 17:58:24

2024 年需要考虑的 16 个知识库趋势和统计数据

自2017年以来&#xff0c;千禧一代已成为全球人口最多的一代。如果您的企业还没有准备好应对这一变化带来的挑战&#xff0c;那么是时候加快这一进程了。 毫不奇怪&#xff0c;千禧一代痴迷于智能手机和技术。他们具有流动性&#xff0c;期望与他们互动的品牌能够即时高效。 …...

编程日记 2024/7/19 17:55:20

微信小程序-实现跳转链接并拼接参数（URL拼接路径参数）

第一种常用拼接方法&#xff1a;普通传值的拼接 //普通传值的拼接checkRouteBinttap: function (e) {wx.navigateTo({url: ../checkRoute/checkRoute?classId this.data.classInfo.classId "&taskId" this.data.classInfo.taskId,})}第二种&#xff1a;拼接…...

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

【代码随想录|第十一章 图论part01 | 797.所有可能的路径 】

代码随想录|第十一章 图论part01 | 图论理论基础&#xff0c;797.所有可能的路径&#xff0c;广搜理论基础 一、图论理论基础1.图的基本概念2.图的构造1&#xff09;邻接矩阵2&#xff09;邻接表 3.图的遍历方式4.深度优先搜索理论基础 二、797.所有可能的路径1.核心代码2.问题…...

编程日记 2024/7/19 17:52:16

尚硅谷大数据技术-数据湖Hudi视频教程-笔记03【Hudi集成Spark】

大数据新风口&#xff1a;Hudi数据湖&#xff08;尚硅谷&Apache Hudi联合出品&#xff09; B站直达&#xff1a;https://www.bilibili.com/video/BV1ue4y1i7na 尚硅谷数据湖Hudi视频教程百度网盘&#xff1a;https://pan.baidu.com/s/1NkPku5Pp-l0gfgoo63hR-Q?pwdyyds阿里…...

编程日记 2024/7/19 17:50:15

【python】Pandas中IndexError: single positional indexer is out of bounds的报错分析

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…...

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

ubuntu上通过修改grub启动参数，将串口重定向到sol

要修改 GRUB 启动参数以实现串口重定向到 Serial Over LAN (SOL)&#xff0c;你需要编辑 /etc/default/grub 文件&#xff0c;并更新 GRUB 配置。这里是详细步骤&#xff1a; 1. 编辑 /etc/default/grub 打开终端并使用文本编辑器&#xff08;如 nano 或 vim&#xff09;编辑…...

编程日记 2024/7/19 17:46:11

【Git】（基础篇四）—— GitHub使用

GitHub使用 经过上一篇的文章&#xff0c;相信大家已经对git的基本操作熟悉了&#xff0c;但哪些使用git的方法只是在本地仓库进行&#xff0c;本文介绍如何使用git和远程仓库进行连接使用。 Github和Gitee 主要用到的两个远程仓库在线平台是github和gitee GitHub GitHub …...

编程日记 2024/7/19 17:43:08

【Qt+opencv】基础的图像绘制

文章目录 前言line函数ellipse函数rectangle函数circle函数fillPoly函数putText函数总结 前言 在计算机视觉和图像处理领域&#xff0c;OpenCV是一个强大的库&#xff0c;提供了丰富的功能和算法。而Qt是一个跨平台的C图形用户界面应用程序开发框架&#xff0c;它为开发者提供…...

编程日记 2024/7/19 17:39:04

网站设置伪静态/广州白云区疫情实时动态

首先声明一下&#xff0c;这不是我的原创&#xff0c;只是借用别人的东西&#xff0c;放在这里以供自己查阅和大家一起分享&#xff0c;如果原作者看不到了&#xff0c;可以留言与我联系&#xff0c;要求删除 js中数组常用方法总结 前言 从事前端到现在也有快两年了&#xff0…...

编程日记 2024/11/20 6:01:32

柯桥做网站哪家好/网络软文营销案例

使用 sorted() 函数的 key 参数对元组列表进行排序&#xff0c;例如 sorted_list sorted(list_of_tuples, keylambda t: t[1])。 该函数将按指定索引处的元组元素对元组列表进行排序。 list_of_tuples [(1, 100), (2, 50), (3, 75)]# ✅ 按索引处的元素对元组列表进行排序&a…...

编程日记 2024/11/20 5:47:23

上海建设银行网站静安支行/站长域名查询工具

为什么80%的码农都做不了架构师&#xff1f;>>> RT 转载于:https://my.oschina.net/230/blog/143545...

编程日记 2024/11/20 0:58:25

秭归网站建设/南昌网站seo

插入排序&#xff08;Insertion sort&#xff09;是一种简单直观且稳定的排序算法。如果有一个已经有序的数据序列&#xff0c;要求在这个已经排好的数据序列中插入一个数&#xff0c;但要求插入后此数据序列仍然有序&#xff0c;这个时候就要用到一种新的排序方法——插入排序…...

编程日记 2024/11/19 22:35:25

泰安做网站公司哪家好/seo顾问服务 乐云践新专家

目录注释变量和常量标识符的命名规范字符串输出键盘输入数据类型整数类型浮点类型字符类型布尔类型Unit类型&#xff0c;Null类型和Nothing类型&#xff08;重点&#xff09;Unit类型Null类型Nothing类型类型转换数值类型自动转换强制类型转换注释 scala的注释的使用跟JAVA是一…...

编程日记 2024/11/19 17:02:56

书籍封面设计网站/网站收录申请

DevExpressVCL5.2 下载 Fast report 4.9.105 下载 Ehlib 5.2.84 下载 TMS component Pack 5.7.0.1 下载 unidac 3.0.0.9 下载 SynEdit for D2010 下载...

编程日记 2024/11/19 13:28:38