此组件将托管上下文对象，并允许使用组件订阅上下文并使用 useForm 属性和方法。

属性

以下表格适用于 FormProvider，useFormContext 不接受任何参数。

名称	类型	描述
`...props`	对象	`FormProvider` 需要所有 `useForm` 方法。

规则

避免使用嵌套的 FormProvider

示例

CodeSandbox ^JS

import React from "react"

import { useForm, FormProvider, useFormContext } from "react-hook-form"

export default function App() {
  const methods = useForm()

  const onSubmit = (data) => console.log(data)

  return (
    <FormProvider {...methods}>
      // pass all methods into the context
      <form onSubmit={methods.handleSubmit(onSubmit)}>
        <NestedInput />
        <input type="submit" />
      </form>
    </FormProvider>
  )
}

function NestedInput() {
  const { register } = useFormContext() // retrieve all hook methods

  return <input {...register("test")} />
}

感谢您的支持

如果您发现 React Hook Form 在您的项目中很有用，请考虑给它点个赞并支持它。