ForEachElement

<ForEachElement> safely iterates array elements. It accepts an array field and a render prop as its child, which is called once for each element.

The counterpart hook is useElements.

Sample usage

const form = useForm({
   initialValues: {
       tags: ["typescript", "react"]
   }
});
return (
    <ForEachElement field={form("tags")}>
        { tagField => <Input field={tagField} /> }
    </ForEachElement>
)

Type

function ForEachElement<T>(props: {
    // The array field to iterate over
    field: FormField<T[]>

    // A render function that will be used for each child
    // `element`: the child to render
    // `idx`: the index of the child to render. Mostly useful for removing by index
    children: (element: FormField<T>, idx: number) => ReactNode
})