✨ useFieldArray Composable

The useFieldArray composable is a utility function that helps you manage arrays of fields in your form. This composable is useful when you have a dynamic list of fields that can be added or removed by the user.

📦 Usage

To use the useFieldArray composable, you need to pass the formik object as an argument.

import { useFieldArray } from 'vue-formik';

const formik = useFormik({
  initialValues: {
    users: [
      { name: 'Alice', age: 25 },
      { name: 'Bob', age: 30 },
    ],
  },
});
const { push, pop } = useFieldArray(formik);

Note: formik parameter

The formik parameter is the object returned by the useFormik composable.

📚 API

The composable returns an object with the following properties:

1. push (field: string, value: unknown, index?: number)

A function that adds a new field to the array. The field parameter is the name of the field, the value parameter is the initial value of the field, and the index parameter is the index at which to insert the field.

2. pop (field: string, index?: number)

A function that removes the last field from the array. The field parameter is the name of the field, and the index parameter is the index of the field to remove.

Note: Out of Bound

If the provided index is out of bounds, the function will log a warning message to the console and do nothing.

If no index is provided, the function will remove the last field in the array.