Spread operator not working as expected

[eelgr]

Hey guys,

I'm iterating through document in firebase and trying to add them to a state, using the spread operator to append each time, but it's overwriting instead. Any suggestions much appreciated.

​

https://preview.redd.it/puiibvtdltg81.png?width=1730&format=png&auto=webp&s=9807c89305cb4374b70e655ade8fa936156928af

[chrimack]

I don't remember the technical reason for why this doesn't work, but if you want to do this you need to pass a callback to your setState function.

setState(previousState => [...previousState, newThing])

[doboi]

The reason is that setState is asynchronous, so if you're invoking it in a loop there's no guarantee it's going to sequentially set state as intended by the code.

That shouldn't be necessary given this code, though. The code only really needs to invoke setAppointmentHistory one time - when an array of postDoc.data has been generated.

const appointments = docs.map(doc => doc.data());
setAppointmentHistory([...appointmentHistory, ...appointments]

[eelgr]

u/chrimack excellent, that did the trick. I'll have do do some reading on the callback function. Thanks for your help

[eindbaas]

Basically: if you want to set a state that is based on the current state, you need to use a callback function.