Nested conditional components have a weird behaviour with setValue when using shouldUnregister

[tkremeyer]

Hey there,

first of all, thanks for providing this library which surely has made my work easier!

I have a rather complex form with the following requirements:

• The form includes various nested sections that should be dynamically mounted and unmounted depending on the value of certain (MUI) Checkboxes/ToggleButtons.
• Fields that are unmounted at the time of submission must not be included in the submitted object
• An export feature that creates a json file from the state of the form
• An import feature that applies the content of an uploaded json file back to the form

I managed to implement the form using Components that wrap around MUI elements more or less like shown in the codesandbox provided by the RHF documentation. In order to not include unmounted fields in the submitted object, I found the option shouldUnregister in useForm() to work well. However, I am having issues importing data into the nested parts of the form using setValue.

I created an example showcasing my issue in a CodeSandbox.

As you can see in the CodeSandbox, I provide three examples with each more or less the same form structure. Each example form has a button to "import" a (hardcoded) state of the form using setValue for each field. Click each button multiple times to see the effect for each case.

• when using nested conditional <Component>s with shouldUnregister = true, only the changes on the highest layer are applied on the first click of Import. For each subsequent click, as the nested components of the next layer are now mounted, the content of the next layer is applied too.
• without shouldUnregister = true, all fields are filled in properly on the first click
• with shouldUnregister = true but with classic <input>s instead of components, the import feature also works properly

For this reason, I believe that I haven't fully understood how <Component>s work or they have some issues properly working together with shouldUnregister.

Did I miss anything on the correct usage of Components? Did I take a bad approach for my problem?

I would be glad for any hints!