React hook Form 知道值何时被修改

Question

我们如何知道 form 是否以react-hook-form 被修改。任何人都有想法。我想知道是否有任何值发生更改并将编辑的状态更新为 true。

在我向 useForm({defaultValues:values}) 提供 defaultValue 后。我想在值更新或更改默认值时收到通知。

Answer 1

使用isDirty财产

function YourComponent() {
 const { formState } = useForm();
 const isFormEdited = formState.isDirty;
 ....

这是文档参考

Answer 2

弄清楚如何实现这一点。指定 defaultValues 属性非常重要。

请参阅 formState文档的 isDirty 部分：

确保在 useForm 中提供所有输入的默认值，以便钩子表单可以有单一的事实来源来比较表单是否脏。

一个简短的例子：

  const {
    formState: {
      isDirty, 
    },
  } = useForm<ProfileFormInterface>({
    defaultValues: {name: 'John Doe', email: 'jd@johndoe.com'},
  })

isDirty现在仅当姓名或电子邮件更改时才为真。