CODEWITHSUNDEEP
reactjsredux
theog
theog

Reputation: 2092

react redux synchronous call

Building a React application with redux as the flux pattern.

To use an api a token exchange request needs to happen. This has to occur only once when the React application starts. The access_token returned from the token exchange needs to be stored in the redux state and accessible by other api calls.

One approach i tried is by calling a redux action in the App(parent) component, and then all other calls are within children components. New to React i now understand that this is not the right approach as the React components lifecycle events and the actions and reducers called do not follow a synchronous flow, so the redux actions are called asynchronously.

How do i ensure a redux action is called prior to any other redux action that depends on the results of the first redux action? Which middleware would be best suited for ensuring a synchronous approach redux-thunk, redux-look and redux-saga.

Upvotes: 1

Views: 3298

Answers (2)

Damien Leroux
Damien Leroux

Reputation: 11703

You can use redux-thunk to have a "promise like" behavior when displatching actions. This way you can ensure an action was done before dispatching another one.

Upvotes: 0

Pandaiolo
Pandaiolo

Reputation: 11586

If you need a process to run before any other action, you could do it before creating the store, and passing the result in your main reducer function at store creation.

Then, just render the app after the promise or callback of this process is done.

Otherwise, just dispatch this initial action after the store creation, and before app render (with redux-thunk if it is async).

Upvotes: 0

Related Questions