FieldRenderProps

Represents the props that are passed to the component which is rendered by Field.

children any

Represents the children that are passed to the Field.

modified boolean

Indicates if the field is modified. The modified state is set to true when the onChange callback for the current field is called for first time.

onBlur () => void

A callback you have to call when the rendered component is blurred. Responsible for setting the touched state of the Field.

onChange (event: { target?: any; value?: any; }) => void

A callback you have to call when the value of the rendered component is changed (see example). The value property of the event takes precedence over target.value.

onFocus () => void

A callback you have to call when the rendered component is focused. Responsible for setting the visited state of the Field.

touched boolean

Indicates if the field is touched. The touched state is set to true when the onBlur callback is called.

valid boolean

A calculated property based on whether validationMessage is present and the touched state is set to true.

validationMessage string | null

Represents the error message that is returned by the validator. The Field is considered valid if the validationMessage field is empty.

value any

Represents the current value of the Field (see example).

visited boolean

Indicates if the field is visited. The visited state is set to true when the onFocus callback is called.