useFieldArray

<Item = any>(name: string, formId?: string) => [itemDefaults: Item[], helpers: FieldArrayHelpers<Item>]

A hook that makes it easy to work with dynamic arrays of values. It returns a tuple that contains the default values for each item and the helpers for manipulating the array.

Example

Parameters

name

string

The name of the "field". If you're using array syntax, then this is the base name of the field (not include array index specifier).

Example: If you're items named todos[0], todos[1], etc, then the name would be todos.

formId

string

Optional

Allows you to use the hook outside a form.

FieldArrayHelpers

Many of these helpers parallel native array helpers, but please note that, unlike the native array methods, none of these helpers return anything.

push

(item: Item) => void

Adds a new item to the end of the array.

swap

(indexA: number, indexB: number) => void

Swaps the items at the given indices.

move

(from: number, to: number) => void

Moves the item at the from index to the to index.

insert

(index: number, item: Item) => void

Inserts an item at the given index.

unshift

() => void

Removes the item at the start of the array.

pop

() => void

Removes the item at the end of the array.

remove

(index: number) => void

Removes the item at the given index.

replace

(index: number, item: Item) => void

Replaces the item at the given index.