redux-thunk-async

usage

1import thunkWidthAsync from 'redux-thunk-async';
2
3const middleWares = [
4    thunkWithAsync,
5    // other middleWares...
6];
7const createStoreWithMiddleware = applyMiddleware(...middleWares)(createStore);
8
9createStoreWithMiddleware(reducers);

regular thunk action

1export function bar(foo) {
2    return {
3        type: 'BAR',
4        foo,
5    };
6}
7
8export function test(foo) {
9    return dispatch => {
10        dispatch(bar(foo));
11
12        return {
13            type: 'TEST',
14            test: foo,
15        };
16    };
17}
18

regular async action

1export function getRepos(url) {
2    return {
3        types: [
4            actionTypes.REPOS_REQUEST,
5            actionTypes.REPOS_SUCCESS,
6            actionTypes.REPOS_FAILURE,
7        ],
8        payload: {
9            repos: api.getRequest(url).then(res => res.json()),
10        },
11    };
12}

async thunk action

1export function getUser(adminID) {
2    return dispatch => ({
3        types: [
4            actionTypes.USER_REQUEST,
5            actionTypes.USER_SUCCESS,
6            actionTypes.USER_FAILURE,
7        ],
8        payload: {
9            user: api.user(adminID)
10                .then(res => res.json())
11                .then(json => {
12                    dispatch(getRepos(json.repos_url));
13                    return json;
14                }),
15            adminID,
16        },
17    });
18}