Usage and Customization

How to use react-jsonschema-form and customize your form behavior and appearance.

📄️ Arrays

Arrays are defined with a type equal to array, and array items' schemas are specified in the items keyword.

📄️ Schema definitions and references

This library partially supports inline schema definition dereferencing, which is Barbarian for avoiding to copy and paste commonly used field schemas:

📄️ Dependencies

react-jsonschema-form supports the dependencies keyword from an earlier draft of JSON Schema (note that this is not part of the latest JSON Schema spec, though). Dependencies can be used to create dynamic schemas that change fields based on what data is entered.

📄️ Objects

Object properties

📄️ oneOf, anyOf, and allOf

react-jsonschema-form supports custom widgets for oneOf, anyOf, and allOf.

📄️ Single fields

The simplest example of a JSON Schema contains only a single field. The field type is determined by the type parameter.

📄️ Themes

By default, this library renders form fields and widgets leveraging the Bootstrap semantics,

📄️ Validation

When the form is submitted, the form data is validated to conform to the given JSON schema; this library uses the ajv validator by default.

📄️ Widgets

The uiSchema ui:widget property tells the form which UI widget should be used to render a field.