![Apache 2.0 License](https://img.shields.io/badge/license-Apache%202.0-blue.svg?style=flat-square)
@rjsf/validator-ajv8
AJV-8 based validator plugin for react-jsonschema-form
.
Explore the docs »
View Playground
·
Report Bug
·
Request Feature
Table of Contents
About The Project
Exports validator-ajv8
plugin for react-jsonschema-form
.
Built With
Getting Started
Prerequisites
React JsonSchema Form Utils
yarn add @rjsf/core
Installation
yarn add @rjsf/validator-ajv8
Usage
import {RJSFSchema} from "packages/utils/dist/index";
import Form from 'packages/core/dist/index';
import validator from '@rjsf/validator-ajv8';
const schema: RJSFSchema = {
type: 'string',
};
<Form schema={schema} validator={validator}/>
or, using a more complex example using custom validator with custom formats
import { RJSFSchema } from "@rjsf/utils";
import Form from '@rjsf/core';
import { customizeValidator } from '@rjsf/validator-ajv8';
const customFormats = {
'phone-us': /\(?\d{3}\)?[\s-]?\d{3}[\s-]?\d{4}$/
};
const validator = customizeValidator({
customFormats,
});
const schema: RJSFSchema = {
type: 'string',
format: 'phone-us'
};
<Form schema={schema} validator={validator} />
or, using a more complex example using a custom with additional meta schema
import { RJSFSchema } from "@rjsf/utils";
import Form from '@rjsf/core';
import { customizeValidator } from '@rjsf/validator-ajv8';
const metaSchemaDraft06 = require("ajv/lib/refs/json-schema-draft-06.json");
const validator = customizeValidator({
additionalMetaSchemas: [metaSchemaDraft06],
});
const schema: RJSFSchema = {
"$schema": "http://json-schema.org/draft-06/schema#",
type: 'string',
};
<Form schema={schema} validator={validator} />
or, using a more complex example using custom validator config override options
import { RJSFSchema } from "@rjsf/utils";
import Form from '@rjsf/core';
import { customizeValidator } from '@rjsf/validator-ajv8';
const validator = customizeValidator({
ajvOptionsOverrides: {
$data: true,
verbose: true,
}
});
const schema: RJSFSchema = {
type: 'string',
};
<Form schema={schema} validator={validator} />
or, using a more complex example using ajv-formats
custom format options.
import { RJSFSchema } from "@rjsf/utils";
import Form from '@rjsf/core';
import { customizeValidator } from '@rjsf/validator-ajv8';
const validator = customizeValidator({
ajvFormatOptions: {
keywords: true,
formats: ["date", "time"]
}
});
const schema: RJSFSchema = {
type: 'string',
};
<Form schema={schema} validator={validator} />
Finally, you can combine both additional meta schemas, custom formats, custom validator config override options and ajv-formats
custom format options.
import { RJSFSchema } from "@rjsf/utils";
import Form from '@rjsf/core';
import { customizeValidator } from '@rjsf/validator-ajv8';
const metaSchemaDraft06 = require("ajv/lib/refs/json-schema-draft-06.json");
const customFormats = {
'phone-us': /\(?\d{3}\)?[\s-]?\d{3}[\s-]?\d{4}$/
};
const validator = customizeValidator({
additionalMetaSchemas: [metaSchemaDraft06],
customFormats,
ajvOptionsOverrides: {
$data: true,
verbose: true,
},
ajvFormatOptions: {
keywords: true,
formats: ["date", "time"]
}
});
const schema: RJSFSchema = {
"$schema": "http://json-schema.org/draft-06/schema#",
type: 'string',
format: 'phone-us'
};
<Form schema={schema} validator={validator} />
Roadmap
See the open issues for a list of proposed features (and known issues).
Contributing
Read our contributors' guide to get started.
Contact
rjsf team: https://github.com/orgs/rjsf-team/people
GitHub repository: https://github.com/rjsf-team/react-jsonschema-form