How To Have A Callback Function After Setting The State For Each Individual Loop In A Foreach Loop?

trying to callback a function after each individual loop after setting the state. but the callback will execute twice with the most recent state rather then both states. onAddClic

Solution 1:

this.state shouldn't be used together with setState because state updates are asynchronous. This may result in race condition, which is the problem here.

This is what updater function is for:

this.state.tempAddList.forEach((id) => {
    this.setState(
      state => ({modInfo: {...state.modInfo, modId: id}}),
      ()=>this.addModifier())
    ;
});