企业官网建设流程全解析

Univer数据验证与条件格式实战：3分钟上手

【免费下载链接】univerUniver is a full-stack framework for creating and editing spreadsheets / word processor / presentation on both web and server.项目地址: https://gitcode.com/GitHub_Trending/un/univer

HR 小周在核对一份 500 人的员工花名册：性别列有人手滑填成"男1"，年龄列混进了 0 和 999，统计脚本一跑全乱。同样的表如果放在 Univer 里，用数据验证把输入限制住，再用条件格式让异常值自动变色，这些问题在录入那一步就被拦下了。

先看效果

这是 Univer 表格的标准视图：验证的下拉框、拦截提示，以及条件格式的着色，都会直接渲染在这样的单元格网格上，无需刷新、无需手动改格式。

🔒 数据验证：列表下拉与数字范围这样设

场景：花名册里的"男1"和 0 岁员工

解决"同一列允许任意内容"导致的脏数据：性别列只给下拉选项，年龄列只收 18–60 之间的数字。

原理：像门卫核验身份证一样拦截输入

把数据验证理解成门卫核验身份证：每个输入在写进单元格之前，都要先过一遍你设好的规则。规则可以是候选列表、数字区间或日期范围，校验不通过就不让写入，并弹出你自定义的提示。这套逻辑的入口在数据验证模块，列表、数字、日期、复选框、自定义公式各有对应校验器。

操作：三步给性别列加下拉

1. 选中 A2:A501（性别列区域）。
2. 打开数据验证面板，选择"列表"类型，输入候选值男,女，勾选"在单元格中显示下拉箭头"。
3. 对年龄列 B2:B501 重复操作：选"小数"类型，区间18 到 60，并填写错误提示"年龄必须在 18-60 之间"。

用代码方式添加规则效果相同：

// 为 A2:A501 添加"男/女"列表验证 univer.executeCommand(AddSheetDataValidationCommand.id, { unitId: 'sheet-1', subUnitId: 'sheet-1', rule: { range: { startRow: 1, startColumn: 0, endRow: 500, endColumn: 0 }, // A2:A501 type: DataValidationType.LIST, // 列表类型 formula1: '男,女', // 下拉候选值 renderMode: DataValidationRenderMode.ARROW, // 显示下拉箭头 }, });

数字范围验证只需把type换成DataValidationType.DECIMAL，operator设为BETWEEN，formula1/formula2填 18 和 60 即可。规则的定义与更新命令都在>// 用代码添加"大于 10000 标红"规则 univer.executeCommand(AddCfCommand.id, { rule: { ranges: [{ startRow: 1, startColumn: 1, endRow: 100, endColumn: 1 }], // B2:B101 type: CFRuleType.highlightCell, // 单元格高亮 subType: CFSubRuleType.number, operator: CFNumberOperator.greaterThan, // 大于 value: 10000, style: { bg: { rgb: 'FFFF4D4F' } }, // 红色背景 }, });

规则生效后，命中的单元格会带上背景色，效果就渲染在这样的表格数据区中，四类规则的结构定义可以对照 type.ts 查看。

验证：改一个数字看颜色

把 B5 从 8000 改成 12000，背景立刻变红；改回 6000 颜色消失，说明规则已随数据联动。

📊 组合实战：一张项目进度表管住两头

以项目进度管理表为例：A 列任务名、C 列完成百分比，数据验证管住"输入"，条件格式管住"展示"。

1. C2:C51 添加数据验证：小数类型，区间0–100，错误提示"百分比必须填 0-100 的数字"。
2. 同一列添加两条条件格式：大于等于 80 绿色填充，小于 30 红色填充。
3. 给 C 列叠加数据条规则，进度一眼可见（可选）。
4. 验证：输入 120 被验证规则拦截；输入 85 变绿底；输入 20 变红底。

录入端和展示端各守一道，进度表从此不用人工抽查。

速查表

门卫和红绿灯都装好之后，表格质量就不再靠大家自觉了。

【免费下载链接】univerUniver is a full-stack framework for creating and editing spreadsheets / word processor / presentation on both web and server.项目地址: https://gitcode.com/GitHub_Trending/un/univer