<ReactFormFields>

It is a wrapper component that you need to use to wrap multiple <ReactFormField> components.

<ReactForm>
  {({ context }) => (
    <ReactFormFields>
      {({ values, dirtyValues, fieldErrors, hasError }) => (
        // Fields
      )}
    </ReactFormFields>
  )}
</ReactForm>

Render Props

values

• Type: Object

All current form values as key-value pairs.

dirtyValues

• Type: Object

Only the fields that have been modified from their initial values.

fieldErrors

• Type: Object

Object containing field-level errors. Combines both validation errors and API errors.

hasError

• Type: Function
• Signature: (fieldName: string) => boolean

Function to check if a specific field has an error.

<ReactFormFields>
  {({ values, dirtyValues, fieldErrors, hasError }) => (
    <>
      <ReactFormField name="email">
        {({ field, label, error }) => (
          <>
            <label>{label}</label>
            <input type="email" {...field} />
            {hasError("email") && <span className="error">Error exists</span>}
          </>
        )}
      </ReactFormField>
    </>
  )}
</ReactFormFields>