JSON Editor 中实现字段比较验证的方法

在表单开发过程中，经常需要实现字段间的比较验证，例如确保结束日期大于开始日期、最大值不小于最小值等业务逻辑。JSON Editor作为一款流行的JSON表单生成工具，提供了灵活的验证机制来实现这类需求。

基本验证原理

JSON Editor内置了基于JSON Schema的标准验证功能，可以通过validation属性配置基本的验证规则。对于简单的字段比较验证，可以使用const或enum等关键字实现固定值的比较，但对于动态字段间的比较，需要更灵活的解决方案。

自定义验证函数

JSON Editor支持通过validate属性注册自定义验证函数，这是实现字段比较验证的核心方法。开发者可以编写JavaScript函数来检查字段间的关系，并在条件不满足时返回错误信息。

{
  type: "object",
  properties: {
    fieldX: { type: "number", title: "Field X" },
    fieldY: { type: "number", title: "Field Y" }
  },
  validate: function(instance) {
    const errors = [];
    if (instance.fieldX > instance.fieldY) {
      errors.push({
        path: "fieldX",
        property: "validation",
        message: "Field X must be less than or equal to Field Y"
      });
    }
    return errors.length ? errors : null;
  }
}

验证错误处理

当自定义验证函数返回错误数组时，JSON Editor会自动在对应字段下方显示错误信息。每个错误对象包含三个关键属性：

• path: 指定错误关联的字段路径
• property: 固定为"validation"表示验证错误
• message: 展示给用户的错误提示信息

进阶应用技巧

1. 双向验证：可以在错误数组中为两个字段都添加错误提示，增强用户体验
2. 条件验证：只在特定条件下执行比较验证，例如当两个字段都有值时才进行比较
3. 异步验证：结合Promise实现需要后端验证的复杂场景
4. 动态错误信息：根据业务需求生成包含具体数值的错误提示

最佳实践建议

1. 保持验证逻辑简洁明了，复杂的业务规则建议拆分为多个简单验证
2. 为用户提供清晰、友好的错误提示信息
3. 考虑在表单提交时统一触发验证，避免频繁的实时验证影响用户体验
4. 对于常见验证模式，可以封装为可复用的验证函数

通过合理利用JSON Editor的自定义验证功能，开发者可以轻松实现各种复杂的业务验证需求，构建健壮的表单应用。