positional value of array element changing after deleting

[Camelot93]

Hey I have an issue, when i delete an element in an array with Rnd as a parent all elements that are ahead of the deleted one move to the position of the element before them. how do I change that?

[sanjitgroverincedo]

Hi Camelot93, did you find a solution to this problem?

[aktn]

Having the same thing :(

[bokuweb]

@Camelot93 @aktn Could you please provide a reproduced example in codesandbox?

[sanjitgroverincedo]

Hi @Camelot93, my issue was I was displaying Rnd in row and col. When I added new Rnd on button click, it tends to get in another col causing the error. So I did, Container> {this.state.rnds.map(rnd->Rnd> <Rnd)} /Container> It resolved my issue. Hope this helps.

[bokuweb]

@sanjitgroverincedo Thanks

[Aldemylla]

For anyone still having the same problem, I solved this by changing the index component's key to an identifier

Before: rnds.map((rnd, index) => <Rnd key={index} />) After: rnds.map(rnd => <Rnd key={rnd.id} />)

When deleting an element from the list, the index of its successor would change to the one that was deleted, causing the problem.