react-redux之中间件(react-actions,saga)

redux-actions

亲爱的朋友们，上一章讲到了redux基础篇，以便大家更好的去理解redux工作模式，单向数据流的思维方式，此篇将为大家介绍一个redux中的一个集成插件redux-actions,它的出现以便我们更好的运用redux这个工具，在项目运用更加便洁。

redux-actions之createActions

在未用此插件的时候，一般在actions中，写一个匹配放在方法函数里，导出；应该都知道，action是对象，表示要做什么，把需要的匹配的条件写在action里。

1. createActions方法 ，进行匹配条件，对应的函数功能，它能触发redecuer方法的；

import { createActions } from 'redux-actions';
import {REQUSET_SHARE_START,REQUSET_SHARE_SUCCESS,REQUEST_SHARE_FAILED} from 'Component/store/type/login-management/login-share.js';
const {requsetShareStart,requsetShareSuccess,requestShareFiled} = createActions({
	[REQUSET_SHARE_START]:payload => ({payload}),
	[REQUSET_SHARE_SUCCESS]:payload => {return ({payload})},
	[REQUEST_SHARE_FAILED]:payload => ({payload})

});
export {requsetShareStart,requsetShareSuccess,requestShareFiled};

2.handleActions方法,这是reducer方法集成，在这可以匹配action的条件，在这个函数方法里，对你的业务逻辑进一步优选，他也是对reducer方法的进一步封装；

• ps:1,2中的方法均可单独使用，并非存在冲突。不一定非你不可而已。

const loginShareReducer = handleActions({
  [REQUSET_SHARE_START]:(state,action) =>{return({
  	...state,
  	loginShare:action.payload.payload
  })},
  [REQUSET_SHARE_SUCCESS]:(state,action) =>{return({
  	...state,
  	loginShare:action.payload.payload
  })},
  [REQUEST_SHARE_FAILED]:(state,action) => ({
  	...state,
  	loginShare:action.payload.payload
  })
},defaultState);

而后面的redux-logger/combineReducers这些中间件，基本都是一样的，也一样可以采用多层嵌套而已，也只是应对复杂的业务逻辑，达到更好处理方式。

redux-saga

• 待续。。。