I have an action that updates some search criteria in Redux. I'd like to immediately fetch some data from an API based on that local criteria. The problem is that although the search criteria action dispatch is synchronous, it will not complete before the search results dispatch begins.
Am I missing something obvious? I can think of a few hacky ways to handle this, but what is the best way? Should I set a flag when search criteria updates, and fetch results in componentDidUpdate() if the flag is true? Or should I make updateLocalCriteria() asynchronous just so I can chain fetchApiResults() in the promise chain?
I think I've found my answer. I can get the current state within fetchApiResults(). Therefore, I can get the current search criteria before making the api call.
In your updateLocalCriteria, you probably already change one of the props of your reducer to the new value, I'll call it criteria.
The second dispatch will even wait for your first synchronous update to be finished, even if you don't really need it because you already has access to it.
You can still do what you said, get the current state of your store, but it seems quite overkill to me, since you can simply pass it as a parameter or you action.
Why is Redux passing dispatch into the return function of an action?
How to dispatch redux actions that wait for other async actions to complete?