react-hook-form：isDirty首次触发时不生效问题求助

问题原因 #

这是因为React Hook Form的formState（包含isDirty）更新是异步的，遵循React自身的状态更新逻辑。当你输入"1"后立刻点击"check"按钮，此时isDirty的状态还没完成更新，所以会输出false。

另外你代码里默认值num是数字0，输入框输入的是字符串"1"，两者严格不相等，确实会触发isDirty变为true——只是这个状态更新需要等待React异步渲染周期结束，立即点击按钮时还拿不到最新状态。

解决方案 #

• 开启实时状态更新：初始化useForm时设置mode: "onChange"，让表单状态随输入实时同步：

const { register, formState: { isDirty }, getValues } = useForm({
  defaultValues: { num: 0 },
  mode: "onChange"
});

• 手动对比值：点击按钮时直接用当前值和默认值对比，不依赖isDirty：

const check = () => {
  const currentVal = getValues("num");
  const actualDirty = currentVal !== 0;
  console.log("isDirty", actualDirty);
  console.log("value", currentVal);
};

• 用watch监听变化：通过watch实时获取字段值，或监听isDirty的更新：

const { register, formState: { isDirty }, getValues, watch } = useForm({
  defaultValues: { num: 0 },
});
const numVal = watch("num"); // 实时获取输入值

// 监听isDirty变化
useEffect(() => {
  console.log("isDirty已更新:", isDirty);
}, [isDirty]);

内容的提问来源于stack exchange，提问作者Tuan Kien Do