/redux-async

dispatch async actions in redux

Primary LanguageJavaScript

redux-async-promise

NPM version Build status Test coverage Downloads

RSA-compliant actions which resolve when any prop is a promise middleware for Redux.

Install

npm install redux-async-promise --save

Adding as middleware

import async from 'redux-async-promise';
let createStoreWithMiddleware = applyMiddleware(
  async,
)(createStore);

Usage

// action-creators.js
import { createAction } from 'redux-actions'
import { $inject } from 'redux-async-promise';

export var fetchXxxxx = createAction('Xxxx',
  // payload
  options => ({
    propA: new ModelA.GET(), // a promise
    propB: new ModelB.GET(), // a promise

    propC: (propB, propA) => {
      // 依赖propA, propB,顺序自己定,参数名跟上面要保持一致,否则是undefined
      // 这个最好提出一个单独的函数,比如 function getPropC (propA, propB) {}
      // 然后 propC: (propA, PropB) => getPropC(propA, propB)
      console.log(propA, propB);
      return new ModelC.GET()
    },
    propD: propC => Promise.resolve(propC)
    
    // uglifyjs压缩导致依赖丢失的,可以使用$inject来显示注入参数
    propE: $inject(getPropE)('propD')
  }),

  // meta
  options => ({
    propA: {
      // 单个请求success, error处理
      onSuccess(data) {},
      onError(data) {}
    },
    propB: {
      onSuccess(data) {},
      onError(data) {}
    },

    // 最终结果success, error处理
    success: 'xxxx', // 字符串或者函数 success(data) {}
    error: 'xxx',    // 字符串或者函数 success(data) {},
    always(data) {}
  })
)

function getPropE(propD) {
  return Promise.resolve(propD)
}