useFieldArray: add multiple records at once

[solace]

Apologies if I've missed a similar post, but I have need of adding multiple records to a nested field array (csv upload) and I'm uncertain of the best way to approach this.

1. Iterating append is inefficient for large numbers of inserts.
2. reset to update the entire form object seems a bit overkill, and for some reason gives a Can't perform a React state update on an unmounted component which seems to result from RHF's setFields function internally. I am currently unable to repro with the nestedFieldArrays demo but it seems to have something to do with RHF updates causing components to unmount. I'm not sure if this is related to the fact that I am sharing ref usage.
3. setValue and watch works great, but this means I cannot use append or remove to add and remove individual items because fields and watch do not sync.

What is the recommended method for insertion of multiple items at once into a field array?

Also, I see in https://spectrum.chat/react-hook-form/help/usefieldarray-doesnt-update-fields~38f3406b-6237-410e-a357-940f6895f957?authed=true that you have suggested merging watch and fields, but do you have a recommended way of doing this?

Thank you.

[bluebill1049]

append([])?

[bluebill1049]

remove() it's in the doc.

[segullshairbutt]

Awesome, how can we do the opposite? Delete all records att once?

You can append an empty array.

[eddysapata]

Bill You are Awesome :) <3 Love you :)

[bluebill1049]

Bill You are Awesome :) <3 Love you :)

You too ❤️ thanks

[Johnrobmiller]

Not sure this is the best dx. Devs who want to append multiple items and don't know about this special use of append are probably just going to stack multiple calls to append one on top of the other, like so:

append(...) // first item
append(...) // second item
append(...) // etc.

When that fails, then waste valuable time troubleshooting, logging, and resort to google. The best dx is the one that is most intuitive, the one devs are going to try the first time before resorting to googling it.

So, the best way to have coded this would have been that multiple calls to append work as expected with no special instructions required.