应封装统一校验函数validateFormCross()，在submit、关键字段变更、blur时主动触发，重置后逐字段调用setCustomValidity，并配合reportValidity()提示；需协调required等原生校验，仅在原生有效后执行交叉逻辑。
直接用 setCustomValidity 做多字段交叉校验，关键不是“单个字段设错”，而是**让校验逻辑主动触发、状态同步、错误信息精准绑定到对应字段**。HTML5 表单验证本身是单字段驱动的，所以必须手动协调多个字段的 validity 状态和错误消息。
把校验逻辑从「事件监听」移到「统一入口」
不要在每个 input 的 change 或 blur 里单独调用 setCustomValidity，容易状态不一致。建议封装一个如 validateFormCross() 的函数，集中处理所有交叉规则，并在以下时机主动调用：
- 表单提交时（
submit事件中preventDefault后执行） - 关键字段值变化后（如日期范围、金额与币种、启用开关与配置项）
- 用户离开任一相关字段时（
blur），但只触发统一校验，不单独设错
每个字段独立管理自己的 validity，但由统一逻辑控制内容
setCustomValidity 是字段级 API，所以仍需对每个参与交叉校验的字段分别调用。例如：一个「开始时间」和「结束时间」字段，不能只给结束时间报错，开始时间也可能因逻辑反向失效（如结束时间被清空，开始时间就变成孤立无效值）：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 先重置所有相关字段的错误：
field.setCustomValidity('') - 再根据业务规则逐个判断并设置：
startTime.setCustomValidity(startTimeValue && endTimeValue && startTimeValue > endTimeValue ? '开始时间不能晚于结束时间' : '');endTime.setCustomValidity(startTimeValue && endTimeValue && startTimeValue > endTimeValue ? '结束时间不能早于开始时间' : ''); - 注意：空字符串
''表示有效；非空字符串表示无效，且会阻断checkValidity()和原生提交
配合 reportValidity() 主动唤起错误提示
仅设 setCustomValidity 不会自动显示气泡提示。用户没提交前，可能不知道哪里错了。可在统一校验后，对第一个出错字段调用 reportValidity()，或遍历所有字段，对有错误的都调用（浏览器会按顺序显示第一个可聚焦的）：
if (!startTime.checkValidity()) startTime.reportValidity();- 也可用
form.reportValidity()—— 它会检查整个表单并报告第一个无效字段（但无法自定义提示顺序或跳过某些字段） - 注意：
reportValidity()会自动聚焦字段并显示默认气泡，适合用户交互反馈
避免与原生约束（required、min/max、type）冲突
如果字段同时设置了 required 和自定义交叉逻辑，要确保两者不矛盾。例如：
- 某个字段仅在「启用开关为开」时才 required → 应动态切换
required属性，并在validateFormCross()中统一判断：if (toggle.checked && !field.value) field.setCustomValidity('此选项启用时必填');
同时记得清除其他情况下的错误：else field.setCustomValidity(''); - 原生
type="number"校验失败时，validity.badInput为 true，此时你的自定义消息不应覆盖它——可先检查field.validity.valid，只在原生校验通过后才执行交叉逻辑
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
