Dispatching actions in callbackFunction

[itsdorosh]

Hi @ivantsov ) Your lib is very helpful in projects, thank you.

Recently I encountered such a phenomenon that when any action is activated inside the callback function, the callback function is called again and again.

The Redux website says that their subscription function allows the dispatch of actions inside the callback function.

What if I need to make a dispatch inside the callback function? Is this possible?

Thank you)

[ivantsov]

Hi @itsdorosh,
Not sure if I understood your question. Can you provide an example with the code?

[itsdorosh]

Sure.

subscribe("some.place.in.store", () => {
    // some code goes here
   store.dispatch(updateAnotherPlaceActions.update("some values"));
}

I understand, that update the same place in store can make recursive call of the callback function, but even if I update another part of store, callback is looped.

[ivantsov]

Hi @itsdorosh, so I investigated the issue and turned out there's a bug indeed. I'm gonna fix it asap, but can't promise anything really soon.

[ivantsov]

Hi @itsdorosh, I dived deeper into the problem and that's what I found/realized:

1. You mentioned that Redux's subscribe allows dispatching actions inside the callback function. Which is true, however here it also says:

You may call dispatch() from a change listener, with the following caveats:
The listener should only call dispatch() either in response to user actions or under specific conditions (e. g. dispatching an action when the store has a specific field). Calling dispatch() without any conditions is technically possible, however it leads to an infinite loop as every dispatch() call usually triggers the listener again.

So, basically the issue you described for redux-subscribe also exists in Redux itself. And the correct solution is already proposed - use conditions.

2. What you're doing in your example is dispatching an action as a reaction on another dispatch. Which I do think you should avoid, because it can be done within 1 action.

To summarize, redux-subscriber allows calling dispatch inside subscriber callback, but it might lead to an infinite loop. In order to avoid you should use conditions. And better choice would be not to call dispatch inside, because it means that you likely have a problem with your app/redux store architecture.

[tol-is]

Indeed, I experienced the same issue, and also ended up using a conditional statement, and also dispatched the action in a setTimeout to ensure store is updated before my side-effect action is dispatched.