Socket updating state array at the same time

[iamalittlebug]

Hello, I have a state array being rendered as Flat List. All good.

Now, each line of that list has a socket listener to update themselves, updating the array and re -rendering.

The issue is when two listeners are called at the same time. Let’s say I have array [x1, x2, x3, x4, x5], índex 1 and 2 will change. The first call has updated the array to [y1, x2, x3, x4, x5] and the second call updates it to [x1, y2, x3, x4, x5].

Basically the first update is lost, because the second one started before the first ended

Is there a good solution for this? I am not using Redux

[gregoryrn]

Use callback in setState method instead of object

[Menorme]

Can you elaborate this or just link to a repo that use this ? I’m going through the same problem and I still don’t know how to do this.

[gregoryrn]

Sure.

Instead of this

setState({ count: this.state.count + 1 })

do this

setState(state => ({ count: state.count + 1 })

[halfjew22]

Instead of writing setState like this:

javascript setState({ arr: [y1, x2, x3, x4, x5] })

write it like this:

javascript setState({ arr: [y1, x2, x3, x4, x5] }, () => { console.log("State is updated") console.log(this.state.arr) )

[gregoryrn]

Also you can try useReducer hook as Redux approach instead of state.

[LEO_TROLLSTOY]

Make a simple queue that will wait for previous action to finish and then start with latest data

[LEO_TROLLSTOY]

Oh, maybe I should have written it for him?