redux-thunk-actions
Easily create action creators
for redux with redux-thunk.
Rationale
With redux-actions you can do:
let increment = ;todeep;
With redux-thunk you can do:
{ // instead of an object, you can return a function return { ; try //we can do async and then dispatch more stuff await api; catche return ; ; }};
With redux-thunk-actions, you can do:
let myFetch = ;
This will generate two of three possible actions:
- MY_FETCH_STARTED
- MY_FETCH_SUCCEEDED
- MY_FETCH_FAILED
- MY_FETCH_ENDED
You can pass both sync and async functions and the actions will be dispatched accordingly.
Installation
npm install --save redux-thunk-actions
Usage
;
non-async
With non async functions, it will dispatch start/fail/end actions anyway.
reducer.js
case 'FETCH_SUCCEEDED': return Object;
You can dispatch as usual:
let fetch = ;;assert;
async
let fetch = ;// you can try/catch dispatch.let data = await ;
With promises:
let fetch = ;;
Errors
reducer.js
//... case 'FETCH_FAILED': return Object;
then if the action throws it fails:
let fetch = ; try //if action is async, you can use await here! ; catche assert; assert;
if you want to suppress throwing exceptions and instead handle errors 100% in the reducers, pass true
as the 3rd argument
const action =
Metadata
Sometimes you want to send metada with your actions
To do so just return an object with payload
and meta
. This properties will be used to generate those values:
let fetch = ;;// will dispatch: // {type: FETCH_START});// {type: FETCH_SUCCEEDED, payload: 3, meta: 4});// {type: FETCH_ENDED, payload: elapsed: 1});