React应用如何编程获取JSON Schema内置format可用值列表

你的场景里已经指定了"$schema": "http://json-schema.org/schema"（对应最新稳定版JSON Schema规范），不需要硬编码格式列表，以下两种方案都可以直接在React项目里用，拿到的取值100%和规范对齐：

• 方案1：从官方元Schema提取（零额外冗余依赖，最稳定）
  JSON Schema官方的元Schema文件本身就明确定义了format字段的所有合法枚举值，你只需要引入对应版本的元Schema，构建/运行时直接提取枚举即可，完全不需要爬文档或者手动维护列表。
  示例代码：

// utils/jsonSchemaFormats.js
// 引入和你项目$schema版本完全对应的官方元Schema
import metaSchema from 'json-schema/meta/schema.json';

export const getBuiltinFormats = () => {
  // 元Schema中format属性的oneOf约束就是所有标准内置值
  return metaSchema.properties.format.oneOf.map(item => item.const);
};

这个方案的优势是完全和规范绑定，后续如果要切换JSON Schema版本，只需要切换引入的元Schema文件即可，自动适配版本间的format差异，不会出现漏值、多值的问题。拿到的列表默认覆盖日期时间、邮箱、主机名、IP地址、资源标识符等所有官方定义的分类。

• 方案2：从现有JSON Schema校验库读取（适合已集成校验能力的项目）
  如果你的React项目已经在使用Ajv这类常用的JSON Schema校验库，这类库本身就内置了全量标准format定义，可以直接从库实例读取列表，不需要额外引入元Schema依赖。
  以最常用的Ajv为例：

// utils/jsonSchemaFormats.js
import Ajv from 'ajv';
import addFormats from 'ajv-formats';

const ajv = new Ajv();
addFormats(ajv);

export const getBuiltinFormats = () => {
  // 实例上挂载的formats属性包含所有已注册的标准格式
  return Object.keys(ajv.formats);
};

注意用这个方法的时候，不要在注册自定义format时和标准format重名，否则提取的列表会混入自定义值，保持默认配置拿到的就是完整标准列表。

注意：不要手动硬编码format列表，JSON Schema不同Draft版本的内置format存在差异，比如Draft 7版本没有duration、idn-email这类2020-12版本新增的格式，以上两种提取方式会自动匹配你使用的规范版本，不会出现版本不兼容的问题。

在前端UI里渲染选项时直接调用方法取值即可，示例：

import { getBuiltinFormats } from '../utils/jsonSchemaFormats';

export default function FormatSelector() {
  const formatList = getBuiltinFormats();
  return (
    <label>
      选择format类型：
      <select>
        {formatList.map(fmt => (
          <option key={fmt} value={fmt}>{fmt}</option>
        ))}
      </select>
    </label>
  );
}

内容的提问来源于stack exchange，提问作者mbadawi23