useWatch for error to avoid useController limitations

[novakdan]

Hello! I am currently trying to figure out a solution for an issue.

I found out that useController uses exact: true by default and I cannot set it myself because it is not exposed as a prop. Consequently, I am unable to setValue on a parent object and expect it to re-render the controlled input field of a nested field right away as I would if I was explicit with the path name.

a) setValue('main.positions.0.activities', [], { shouldValidate: true }))

vs

b) setValue('main.positions', [{ activities: [] }], { shouldValidate: true })

a) works and b) doesn't - meaning that it doesn't trigger a re-render of the component, which uses the useController.

The reason finally makes sense to me. I managed to get around that by using useWatch which I set to exact: false. This works properly for setValue. However, I realised that the error (from useController) field isn't populated either as it doesn't re-render the component. So far I have not found a solution. I tried useFormState with the exact: false setting but that also doesn't work for some reason. The error isn't populated anywhere no matter which RHF hook I use.

Is there any way you found that would help me solve this? The only workaround that I found is to create a function to wrap setValue and call trigger for the field name, as this works fine. But I'm thinking there should be a simpler solution for such a trivial problem.

Any help would be much appreciated. Thank you.