Adding empty objects when submiting values for field array inputs.

Describe the bug
Form is registering non registered array fields with indexes.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://codesandbox.io/s/react-hook-form-usefieldarray-nested-arrays-forked-qc13y
  2. Enter inputs
  3. Click submit query
  4. See concole

Codesandbox link (Required)
https://codesandbox.io/s/react-hook-form-usefieldarray-nested-arrays-forked-qc13y

Expected behavior
There are too many empty fields, it should not exist.

Screenshots
image

Desktop (please complete the following information):

  • OS: MacOS BigSur 11.2.3
  • Browser Firefox Developer Edition
  • Version 87.0b8 (64-bit)

Smartphone (please complete the following information):
didn’t test on smartphone

Additional context
N/A

I just want only fields that has been registered, why it is registiring automatically non registered fields?

3 thoughts on “Adding empty objects when submiting values for field array inputs.

  1. It would be the same.

    useEffect(() => {
      setValue('fieldArray', [....])
    })
    
    {fields.map(...)}
    

    the important part is not to overwrite the id from useFieldArray, you can host your own field array id by changing the keyName in the config and store your own id in the hidden input.

    hope above make sense.