Trigger right after unmounting a field with shouldUnregister causes isValid to be true but errors still contains error #12712
Unanswered
csimomelian
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
When I unmount a field using a local state toggle (open) and have
shouldUnregister
enabled on the Controller, calling trigger(name) immediately after unmounting leads to this unexpected behavior:isValid
becomes trueBut the errors object still contains the error of the unmounted field
Clicking submit does nothing (form doesn't actually submit)
This only happens if
trigger("name")
is called synchronously right after toggling the field's visibility. If I delay the call withsetTimeout(() => trigger("name"), 0)
, the issue does not happen.Steps to reproduce
1 - Render a field with shouldUnregister set to true
2 - Toggle its visibility off (causing unmount and unregister)
3 - Immediately call trigger("fieldName") (before next render)
4 - Observe that isValid === true, but errors still includes the field
5 - Try to submit — nothing happens
Expected behavior
When a field is unmounted and unregistered, calling trigger(name) immediately after should either:
Not trigger validation at all (because the field no longer exists), or
Trigger and clear any existing errors (since the field is no longer part of the form)
Also, isValid should reflect the state of errors.
Additional context
In my actual project the setup is more complex and involves dynamically shown/hidden steps in a form wizard.
However, the core issue seems to stem from calling trigger right after unmounting a field that uses shouldUnregister.
Version: React Hook Form v7.x
Sandbox
Beta Was this translation helpful? Give feedback.
All reactions