useFieldArray.d.ts 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. import { FieldArrayPath, FieldValues, UseFieldArrayProps, UseFieldArrayReturn } from './types';
  2. /**
  3. * A custom hook that exposes convenient methods to perform operations with a list of dynamic inputs that need to be appended, updated, removed etc. • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) • [Video](https://youtu.be/4MrbfGSFY2A)
  4. *
  5. * @remarks
  6. * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn)
  7. *
  8. * @param props - useFieldArray props
  9. *
  10. * @returns methods - functions to manipulate with the Field Arrays (dynamic inputs) {@link UseFieldArrayReturn}
  11. *
  12. * @example
  13. * ```tsx
  14. * function App() {
  15. * const { register, control, handleSubmit, reset, trigger, setError } = useForm({
  16. * defaultValues: {
  17. * test: []
  18. * }
  19. * });
  20. * const { fields, append } = useFieldArray({
  21. * control,
  22. * name: "test"
  23. * });
  24. *
  25. * return (
  26. * <form onSubmit={handleSubmit(data => console.log(data))}>
  27. * {fields.map((item, index) => (
  28. * <input key={item.id} {...register(`test.${index}.firstName`)} />
  29. * ))}
  30. * <button type="button" onClick={() => append({ firstName: "bill" })}>
  31. * append
  32. * </button>
  33. * <input type="submit" />
  34. * </form>
  35. * );
  36. * }
  37. * ```
  38. */
  39. export declare function useFieldArray<TFieldValues extends FieldValues = FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>, TKeyName extends string = 'id'>(props: UseFieldArrayProps<TFieldValues, TFieldArrayName, TKeyName>): UseFieldArrayReturn<TFieldValues, TFieldArrayName, TKeyName>;
  40. //# sourceMappingURL=useFieldArray.d.ts.map