useWatch.d.ts 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import { Control, DeepPartialSkipArrayKey, FieldPath, FieldPathValue, FieldPathValues, FieldValues } from './types';
  2. /**
  3. * Subscribe to the entire form values change and re-render at the hook level.
  4. *
  5. * @remarks
  6. *
  7. * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)
  8. *
  9. * @param props - defaultValue, disable subscription and match exact name.
  10. *
  11. * @example
  12. * ```tsx
  13. * const { control } = useForm();
  14. * const values = useWatch({
  15. * control,
  16. * defaultValue: {
  17. * name: "data"
  18. * },
  19. * exact: false,
  20. * })
  21. * ```
  22. */
  23. export declare function useWatch<TFieldValues extends FieldValues = FieldValues>(props: {
  24. defaultValue?: DeepPartialSkipArrayKey<TFieldValues>;
  25. control?: Control<TFieldValues>;
  26. disabled?: boolean;
  27. exact?: boolean;
  28. }): DeepPartialSkipArrayKey<TFieldValues>;
  29. /**
  30. * Custom hook to subscribe to field change and isolate re-rendering at the component level.
  31. *
  32. * @remarks
  33. *
  34. * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)
  35. *
  36. * @param props - defaultValue, disable subscription and match exact name.
  37. *
  38. * @example
  39. * ```tsx
  40. * const { control } = useForm();
  41. * const values = useWatch({
  42. * control,
  43. * name: "fieldA",
  44. * defaultValue: "default value",
  45. * exact: false,
  46. * })
  47. * ```
  48. */
  49. export declare function useWatch<TFieldValues extends FieldValues = FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(props: {
  50. name: TFieldName;
  51. defaultValue?: FieldPathValue<TFieldValues, TFieldName>;
  52. control?: Control<TFieldValues>;
  53. disabled?: boolean;
  54. exact?: boolean;
  55. }): FieldPathValue<TFieldValues, TFieldName>;
  56. /**
  57. * Custom hook to subscribe to field change and isolate re-rendering at the component level.
  58. *
  59. * @remarks
  60. *
  61. * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)
  62. *
  63. * @param props - defaultValue, disable subscription and match exact name.
  64. *
  65. * @example
  66. * ```tsx
  67. * const { control } = useForm();
  68. * const values = useWatch({
  69. * control,
  70. * name: ["fieldA", "fieldB"],
  71. * defaultValue: {
  72. * fieldA: "data",
  73. * fieldB: "data"
  74. * },
  75. * exact: false,
  76. * })
  77. * ```
  78. */
  79. export declare function useWatch<TFieldValues extends FieldValues = FieldValues, TFieldNames extends readonly FieldPath<TFieldValues>[] = readonly FieldPath<TFieldValues>[]>(props: {
  80. name: readonly [...TFieldNames];
  81. defaultValue?: DeepPartialSkipArrayKey<TFieldValues>;
  82. control?: Control<TFieldValues>;
  83. disabled?: boolean;
  84. exact?: boolean;
  85. }): FieldPathValues<TFieldValues, TFieldNames>;
  86. /**
  87. * Custom hook to subscribe to field change and isolate re-rendering at the component level.
  88. *
  89. * @remarks
  90. *
  91. * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)
  92. *
  93. * @example
  94. * ```tsx
  95. * // can skip passing down the control into useWatch if the form is wrapped with the FormProvider
  96. * const values = useWatch()
  97. * ```
  98. */
  99. export declare function useWatch<TFieldValues extends FieldValues = FieldValues>(): DeepPartialSkipArrayKey<TFieldValues>;
  100. //# sourceMappingURL=useWatch.d.ts.map