GraphQL

connect() is a higher-order component (HoC) that allows you to hook anything into the Form context. It is used internally to construct <Field> and <Form>, but you can use it to build out new components as your needs change.

Type signature

 connect<OuterProps, Values = any>(Comp: React.ComponentType<OuterProps & { FORM: FormContext<Values> }>) => React.ComponentType<OuterProps>

Example

1 import React from 'react';
2 import { connect, getIn } from 'form';
3 
4 // This component renders an error message if a field has
5 // an error and it's already been touched.
6 const ErrorMessage = props => {
7   // All FormProps available on props.form
8   const error = getIn(props.form.errors, props.name);
9   const touch = getIn(props.form.touched, props.name);
10   return touch && error ? error : null;
11 };
12 
13 export default connect(ErrorMessage);