react-hook-form/documentation

issue: useFieldArray Unable to track newly added elements When "shouldUnregister" is enabled

sunkeysun opened this issue · 1 comments

Version Number

7.49.2

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/react-hook-form-unregister-bug-pm4f5f?file=%2Fsrc%2FApp.tsx%3A17%2C22

Steps to reproduce

  1. Click "Add" to add the array item
  2. Looking at the "DevTool", it is found that the most recently added element is not tracked
  3. Click "Submit" and find that the final submitted data does not have a corresponding element

Expected behaviour

It is hoped that if shouldUnregister is enabled globally, the array element data can be tracked normally
After testing, I found that the execution of "unregister" is later than "register", in strict mode, "register" is executed twice, "unregister" is executed once, and it is executed later, which leads to the deletion of the field, and after debugging, the problem may be in the screenshot of the code of "useController", and "unregister" will be executed later than "register" in the code of "useEffect". "unregister" will be executed later than "register".
image
image

What browsers are you seeing the problem on?

No response

Relevant log output

Code of Conduct

  • I agree to follow this project's Code of Conduct

it won't work well with shouldUnregister due to the nature of field array gets input mount and unmount, happy to include that in the doc