When removing an item from a fields list the inputs below that item are cleared

[daniel-a-marshall]

The issue is that when you remove items from the list the inputs in the items below are cleared. I have made a simple reproduction of the issue here https://codesandbox.io/p/sandbox/mutable-moon-df9q2h . I'm sure it's something that I'm doing wrong but I can't figure it out.

Any help would be greatly appreciated

Thanks

[edmundhung]

Thanks for sharing the reproduction!

The issue comes from the id not being stable, which causes React to remount the inputs when items are removed. To fix this, you should pass a stable key to the <li> element instead.

Here’s the fix:

-<li key={hacker.id}>
+<li key={hacker.key}>

No worries, you're not the first to run into this! I'll look into improving this aspect to avoid similar confusion in the future. 🤔

Let me know if that resolves the issue!

[daniel-a-marshall]

Thanks for your help. I should have paid more attention to the field metadata to understand the difference between the key and id. Thanks again