最佳方案是组合代替继承+分层抽象+运行时适配：校验中心暴露validateField和validateAll两个纯函数接口，采用L1（端无关）、L2（端感知）、L3（服务可选）三级校验架构，通过动态规则工厂和轻量桥接层实现多端零迁移适配。
直接用组合寄生继承来设计多端表单校验中心，其实是个误区——它不是最佳解法。真正高效、可维护的方案，是用组合代替继承 + 分层抽象 + 运行时适配。寄生继承容易导致校验逻辑耦合在类层级中，而多端场景（web / 小程序 / 跨平台app）恰恰要求校验能力与ui框架、设备能力、网络环境解耦。
核心原则：校验逻辑不动，执行环境可换
校验中心不绑定 Vue 的 ref、React 的 useState 或 UniApp 的 this.setData。它只暴露两个纯函数接口：
-
validateField(key, value, context)：同步或异步返回错误数组，context包含当前设备类型（web/miniapp）、网络状态、用户权限等运行时信息 -
validateAll(formData, context)：并行校验全部字段，保留各字段独立错误栈，支持中断（如某字段格式非法则跳过后续依赖校验）
三级校验架构：L1–L3 分离关注点
不靠继承链，而是用组合方式把三类校验器作为可插拔模块注入校验中心：
-
L1 — 存在性 & 基础约束（端无关）：必填、非空、类型断言（如 number/string）。所有端共用同一套规则定义，例如
{ required: true, type: 'number' } -
L2 — 格式 & 本地规则（端感知）：手机号校验自动识别
context.device === 'miniapp'后启用微信手机号组件签名验证；日期格式按context.locale切换 ISO / YYYY-MM-DD / 年月日中文格式 -
L3 — 业务 & 异步规则（服务可选）：用户名唯一性、优惠码有效性等，通过统一的
fetcher接口注入，不同端可配置不同 API 域名、超时、重试策略
多端适配的关键：动态规则工厂
避免为每个端写一套 validator。用闭包工厂生成带上下文的校验单元：
- 例如手机号校验：
createPhoneValidator({ device, country })返回一个闭包，内部自动选择 +86/ +852/ +886 规则 - 再如图片上传校验：
createImageValidator({ maxSize: context.device === 'miniapp' ? 2 * 1024 * 1024 : 10 * 1024 * 1024 }) - 所有工厂函数由校验中心统一管理，UI 层只需传入当前上下文，无需感知规则如何构建
与 UI 框架对接：只做最小桥接
每个端封装一个轻量桥接层，仅负责三件事：
- 监听输入事件 → 提取
key和value→ 调用validateField - 接收错误数组 → 映射为该框架的响应式状态（如 Vue 的
ref、React 的useState） - 提交时调用
validateAll→ 阻止默认行为 or 聚合错误提示
桥接层代码不超过 50 行，且不包含任何业务规则。这样新增一个端（比如鸿蒙 ArkTS），只需重写这个桥接层，校验逻辑零迁移成本。
