Package Exports

redux-actions-promise

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (redux-actions-promise) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

npm-version license bower-license

redux-actions-promise

FSA-compliant promise middleware for Redux, supports referencing dispatcher/state in action.

Installation

Install the pkg with npm:

npm install redux-actions-promise --save

or yarn

yarn add redux-actions-promise

or bower

bower install redux-actions-promise

Usage

// store.js
// create store
import ReduxActionsPromise from 'redux-actions-promise';
import { createStore, applyMiddleware } from 'redux';

// Note: this API requires redux@>=3.1.0
export default createStore(rootReducer, applyMiddleware(ReduxActionsPromise));

// actions.js
import {createAction} from 'redux-actions';

// async action
export let addToDo = createAction(CONSTANT.ADD_TODO, (val) => async (dispatch, getState) => {
    console.log('prev state', getState())
    let v = await Promise.resolve('todo: ' + val);
    return v;
});

// sync action
export let deleteToDo = createAction(CONSTANT.DELETE_TODO);

FAQ

why not use redux-thunk ?

I would like to use createAction for FSA.
I don't want to handle promise error in action by myself.

In redux-thunk:

addToDo = (val) => async (dispatch, getState) => {
    let v = await Promise.reject('error');
    // can't output in console
    console.log('addToDo');
    dispatch({
        type: "ADD_TODO",
        payload: {
            val: v
        }
    })
};

If promise is rejected, the programme will be abort. So if you don't want this happen, you should handle it by yourself:

addToDo = (val) => async (dispatch, getState) => {
    try{
        let v = await Promise.reject('error');
        // can't output in console
        console.log('addToDo');
        dispatch({
            type: "ADD_TODO",
            payload: {
                val: v
            }
        })
    } catch(e) {
        dispatch({
            type: "ADD_TODO_ERROR",
            payload: e,
            error: true
        })
    }
};

Use async-await-error-handling maybe simple the code:

import awaitTo from 'async-await-error-handling';

//...

addToDo = (val) => async (dispatch, getState) => {
    const [err, data] = await awaitTo(Promise.reject('error'));
    if(err){
        dispatch({
            type: "ADD_TODO_ERROR",
            payload: e,
            error: true
        });
        return;
    }
    dispatch({
        type: "ADD_TODO",
        payload: {
            val: data
        }
    });
};

why not use redux-promise ?

Because it doesn't support referencing dispatcher or state in action. See #20.

LICENSE

MIT