回到初始状态时，React-hook-form 不会将 isDirty 设置为 false

Posted 2023-02-19

【中文标题】回到初始状态时，React-hook-form 不会将 isDirty 设置为 false

【英文标题】：React-hook-form doesn't set isDirty to false when back to initial state

【发布时间】：2021-03-22 00:32:13

【问题描述】：

在官方exemple for controlled inputs中，如果你修改了一个输入的值，然后将其改回初始值，isDirty将被设置为true但不会被设置回false，dirtyField将包含触摸的字段。

在较旧的exemple with uncontrolled inputs 中，我们的行为并不完全相同。事实上，如果你修改一个输入的值，然后将其改回初始值，isDirty 仍然是 falsy，但dirtyFields 不会包含被触摸的字段。

当表单回到初始状态时，isDirty 不应该设置回 false 并且dirtyFields 应该为空吗？

这是预期的行为吗？

控制器会破坏 formState 吗？

【问题讨论】：

我们在当前工作的项目中遇到了同样的问题。

【参考方案1】：

isDirty 基于表单输入值与默认值。

https://react-hook-form.com/api#formState

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

这是一个输入不受控制的示例： https://codesandbox.io/s/bold-kapitsa-7m6o0?file=/src/App.tsx

带有受控输入的示例： https://codesandbox.io/s/dark-framework-op8jy?file=/src/App.tsx