Why use Redux Thunk then one can do something like this:
ReadableAPI.getCategories().then((categories)=>{
console.log('after getCategories', categories)
this.props.dispatch(addCategories(categories))
})
Isn't this more straightforward and achieves the same thing?
It allows us to return functions instead of objects from redux actions. Plain redux doesn't allow complex logic inside action functions, you can only perform simple synchronous updates by dispatching actions. This middleware extends its ability and lets you write complex logic that interacts with the store.
Writing the component will be more native, with React syntax. No more mapDispatch , mapState , and other connecting things. Another thing is, with this approach, we don't event need Redux Thunk to handle the async action. We just call them directly in an action and dispatch an action when the async action is resolved.
But on the other hand, for bigger projects, Redux-Thunk may sometimes get you in trouble, as it can be hard to scale if your side effect or asynchronous logic increases, whereas in the case of Redux-Saga, it comes power-packed with some amazing things such as concurrent side effects, canceling side effects, debouncing ...
Thunk in Redux 🍔By default actions in Redux are dispatched synchronously, which is a problem for any SPA that needs to communicate with an external API or perform side effects.
Redux Thunk basically allows us to delay the dispatch of an action, i.e we can handle the action returned by the action creator and call the dispatch function when we really want to dispatch.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With