Redux: async and sync dispatches

Brandon

I have a multi-page user registration form in my react/redux app.

When a user clicks "next page," it dispatches a call to update the user's profile in the local redux store (not the server).

When they click "Submit" on the final page, I currently have a click handler along the lines of:

clickHandler: function(formData) {

  dispatch(updateProfileInStore(formData);

  dispatch(saveProfileToServer());
}

My question is: can I be 100% certain that the Redux store w/ my user profile will update before the second dispatch is called?

I'm worried that in some cases the profile might be written to my database before the last page of form data is added to it.

Mark

It's not guaranteed. What you could do is pass saveProfileToServer the new form data have it update state and send the updated form data to the server.

As per the react documentation

setState() does not immediately mutate this.state but creates a pending state transition. ... There is no guarantee of synchronous operation of calls to setState and calls may be batched for performance gains.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

ComponentWillReceiveProps Called Once With Multiple Sync Dispatches but Called Multiple Times With Async Dispatches?

React Redux is ignoring dispatches

Ignoring subsequent Redux Thunk dispatches

react redux dispatches for infinite time with useEffect

React-Redux : How to dispatch async actions and sync actions?

React redux async data sync then re-render view

Async in mapDispatchToProps - wrapper to ensure everything dispatches before rendering

redux-observable epic chain dispatches duplicate actions

Testing a Redux action that dispatches 2 other functions with Jest?

How to test a React component that dispatches a Redux / Thunk action

Multiple action dispatches breaking API fetch request in redux app

How to transform an action creator with multiple dispatches in redux toolkit?

React and Redux: Uncaught Error: A state mutation was detected between dispatches

Unit test for Redux action which dispatches data from database

Redux Toolkit's createAsyncThunk never dispatches rejected action

I am getting mutation of state error between dispatches from redux

A state mutation was detected between dispatches, Redux toolkit and selectors/reselect

Angular and Redux: is it right to dispatch two actions (one sync, one async) triggered by one user interaction?

From sync to async scenario

WebApi async vs sync

Async is out of sync

Sync version of async method

Parallelism with @sync @async in Julia

Contractual async and sync code

NSOperation with a delay - is it async or sync?

Changing Sync call to Async

nodeJS Async vs Sync

Async and sync versions of method

Async function with sync setup