redux-action-generators
You can use it instead redux-thunk to make your code cleaner
Simple example.
redux-thunk:
const INCREMENT_COUNTER = 'INCREMENT_COUNTER'; const increment => type: INCREMENT_COUNTER const incrementAsync = { return { ; };}
redux-action-generators:
const INCREMENT_COUNTER = 'INCREMENT_COUNTER'; const increment => type: INCREMENT_COUNTER const incrementAsync = { ; ;}
Or more real example:
redux-thunk:
const makeSandwichesForEverybody = { if !sandwichesisShopOpen return Promise; return ;};
redux-action-generators:
const makeSandwichesForEverybody = { if !sandwichesisShopOpen return; // even if we're returning 'undefined' dispatch(makeSandwichesForEverybody()) will return a promise with resolved 'undeinfed' value ; ; ; if myMoney > 42 : else ; };
How to configure store with redux-action-generators?
Simplest way:
;;; const middlewares = ;const store = ;
With api
helper and catchError
function:
;;;; // const api = createApi() - api.loadSomeItems() xhr or any other data loaders const initialState = {}const helpers = api: ; // optionalconst catchError = console; // optional, we can catch here all error and use, for example, some api to store itconst middlewares = ; const store = ;
What are helpers?
You can configure helpers when create the store and pass there everything what you need when you will use the action.
This is very similar with thunk.withExtraArgument
(https://github.com/reduxjs/redux-thunk)
How to use helpers?
const someAction = { api; // api.loadSomeItems() returns promise}
How to use catch errors?
const someAction = { try api; error // handle error logic console; }
even if you will not use try-catch construction you can catch this error with catchError
function that you can define when create the store.
All uncaught errors will be there.
License
MIT