I recently try react-hook-form, and got an issue
You can have a look at my Codesanbox
https://codesandbox.io/p/sandbox/youthful-wiles-cm8cf6
And, type the text “1” to the input and immediately click the button “check”, you can see the log that isDirty is false
I think isDirty in this situation would be true, wouldn’t it?
You can wrap your check function with useCallback
to ensure it recreated on isDirty
changes:
const check = useCallback(
(e) => {
e.preventDefault();
alert(formState.isDirty);
console.log(formState.isDirty);
},
[formState.isDirty]
);
Or you can specifically select isDirty
from formState
:
const {
register,
handleSubmit,
formState: { isDirty },
} = useForm({
defaultValues: {
firstName: "",
// lastName: "Luo"
},
});
1