Key/value in fromState not cleared after unmounting its registered component

[aadlc]

In V6 when I toggled a component off, using the watch method, the component will be unmounted and so will any sibling that depends on the unmounted components' value:

For example:

• We have three components <ComponentA />, <ComponentB /> and <ComponentC />.
• When <ComponentA /> equals 'Yes', <ComponentB /> is rendered.
• When <ComponetB /> equals 1 or 2, <ComponentC /> is rendered.
• Finally, if I change <ComponentA /> to 'No' <ComponentB /> and <ComponentC /> will be unmounted and their values will be cleared.

Working example here https://codesandbox.io/s/mui-rfhv6-001-xy39c

On the other hand, in V7 when I change <ComponentA /> to 'No', <ComponentB /> is unmounted but its value is not cleared. Therefore,<ComponentC /> is not unmounted.

Working example here: https://codesandbox.io/s/mui-rhfv7-001-rpg21

I have tried shouldUnregister: true as @bluebill1049 suggested in a previous thread but, still get the same behavior.

What Am I missing?

[aadlc]

Hello @bluebill1049 ,

My apologies in advance for insisting on this matter but, after going through the documentation and StackOverflow questions, I am not sure if this is a bug or the expected behavior.

Would you mind pointing me in the right direction?

[aadlc]

@bluebill1049 help please!

[bluebill1049]

see if you can reproduce the problem in this CSB: https://codesandbox.io/s/youthful-davinci-bm6vq?file=/src/App.js

[aadlc]

I was not able to reproduce it in your CSB above. That said, I was able to fix the issue in my CSB by upgrading from react-hook-form: 7.0.5 to 7.3.5. which is the version in your CSB.

FYI, for future reference, here is the working CSD : https://codesandbox.io/s/mui-rhfv7-001-solved-xkwss

Thank you for the help. You guys rock!!!

[bluebill1049]

Glad it's working