Fields are the heart of this engine, and you can deal whit then in two flavors:
<Form inspect>{// Declareted }<Field fName='latitude'>{(fieldBidings, fieldStatus) => <input {...fieldBidings} />}</Field>{// Factored }<InputField fName={'name'} fInspect/></Form>
The Declarative Way
Note that every prop comes prefixed with f, like fName. This is important because we don't want props been overwritten when interfaces merge, on wrapping fields (see: The Factored Way).
//"fieldBidings" Contains all bindings methods needed to the doble-way binding cycle, like onChange and value...//"fieldStatus" Contains information about the field, like, if it have errors or have been touched...<Field fName='latitude'>{(fieldBidings, fieldStatus) => <input {...fieldBidings} />}</Field>
The Factored Way
Factories make using fields blase fast! Just bake once, e you are ready to go. Note that the new field have the two interfaces. It's own props, plus, the Field props.
Important: I recommend to sufix every baked field with "Field", to avoid messes with the native ones... After all, the baked one, is a new component!
// 1. Bake the fieldconst ComponentField = FieldFactory<ComponentProps>((fprops, props, fieldBindings, fielStatus) =><Component {...props} {...fieldBindings} />)// 2. Use it<ComponentField fName='name'/>