Vue 3 中动态校验“条件必填”需用 reactive 定义 rules 并配合 watch 实时更新；嵌套字段需严格匹配 prop 路径；复杂条件用自定义 validator；提交前调用 validate 全量校验更可靠。
Vue 3 中处理“条件必填”的动态校验，关键在于让 rules 能响应式地随业务逻辑变化，而不是写死。比如：当用户选择“是否出差”为“是”，才要求填写“出差地点”；选“否”，该字段就无需校验。Element Plus 的 el-form 支持这种动态规则切换，但需注意触发时机和绑定方式。
用 reactive + watch 控制规则开关
把 rules 定义为 reactive 对象，再配合 watch 监听依赖字段的变化，实时修改对应字段的校验数组：
- 定义初始规则时，把条件字段（如
isBusinessTrip）和被控字段（如tripLocation）都纳入 model - 在
rules.tripLocation中，初始可为空数组（不校验），或根据默认值设为必填 - 用
watch(() => form.isBusinessTrip, ...)判断是否开启必填，直接赋值新规则数组（含{ required: true, message: '...' }） - 注意：修改
rules.xxx后，需手动调用formRef.value.clearValidate(['tripLocation'])再validateField，避免残留错误提示
prop 路径必须与 model 结构严格匹配
如果表单嵌套在表格里（如 tableData[0].tripLocation），prop 必须写成字符串形式 `tableData.${index}.tripLocation`，且 rules 中也要对应到这个路径的 key（如 rules['tableData.0.tripLocation']）。动态增删行时，建议用 computed 生成完整 rules 对象，避免手动维护下标导致错位。
vue-admin-change-reviewer
下载
审查 Vue 管理后台的变更请求（Vue 2 + Element UI，Vue 3 + Element Plus）。重点关注最小化变更实现、上线风险检查以及回归检查清单生成。
用自定义 validator 实现复杂条件逻辑
当条件不止一个字段参与（例如：“出差类型=国际”且“预算>10000”才必填签证号），推荐使用函数式校验器：
立即学习“前端免费学习笔记（深入）”；
- 在 rules 中为该字段配置
{ validator: (rule, value, callback) => { ... } } - 函数内可读取当前整个
form数据（如form.tripType === 'international' && form.budget > 10000） - 满足条件时校验 value 是否为空，不满足则直接
callback()通过 - 注意：validator 是异步回调，不要忘记调用
callback()，否则校验会一直 pending
提交前统一触发验证更可靠
条件校验容易因 UI 交互节奏快而漏掉中间状态。建议在点击“提交”时，先调用 formRef.value.validate() 全量校验。它会自动遍历所有 prop 对应的规则，包括动态更新后的。若校验失败，validate 的回调中能拿到全部错误字段，方便定位问题。
