redux和redux-thunk

 redux:

        mapStateToProps方法就是容器组件向store声明需要的state的地方，store中的数据会映射到组件的pops中， 因为我们的store是整个应用只有一份，根据redux的思想通过context可以保证每一个组件都可以从context中获取到store，不需要一级一级的从顶层传递下来。所以，一般容器组件上会有这个函数负责通过context获取到store中想要的state，即从store中获取到的state相当于容器组件从父组件拿到的props，因此，mapStateToProps函数一般只存在于容器组件（或顶层组件）中。

       由于，store中的所有state都由reducer来更新，所有一般mapStateToProps方法中需要定义所有的reducer，把所有的reducer的结果都要拿到，保证我们的store中能包含所有的state，也就是我们这个大应用需要的所有数据都能从顶层组件（或容器组件）获取，然后传递下去；

      例如我们有XXXReducer.js、YYYReducer.js和ZZZReducer.js三个reducer，则我们的mapStateToProps函数一般这么写：

const mapStateToProps = (state) =>({

     XXX:state.XXXReducer,

     YYY: state.YYYReducer,

     ZZZ: state.ZZZReducer

    }

)

       前提三个reducer文件通过combineReducers()函数绑定在了一起，并且createStore(reducer,state)生成store时指定了。

      mapStateToProps函数返回了一个对象，即state，这个state包含了3个属性，XXX、YYY和ZZZ，这三个属性就子组件的props，获取时通过props.XXX获得。这个mapStateToProps函数返回的对象就是这个容器组件（或顶层组件）的props，相当于Store传递给容器组件或顶层组件的。

      mapStateToProps函数是通过redux的connect函数与react联系在一起的，如connect（mapStateToProps，mapDispatchToProps）（xxxPages），connect返回的是一个函数，这个函数会调用子组件（傻瓜组件、木偶组件），完成容器组件与木偶组件的链接，而mapStateToProps的返回就是这个木偶组件的props，走这个木偶组件的更新过程。

所以，我们的流程是：

1、当用户界面接受到一个请求则会dispatch一个action，这个action会调用相应的reducer；

2、reducer的会返回新的状态，这时store的状态就会刷新；

3、在React-Rdux中如果用connect链接了容器组件和木偶组件后，connect就会监听store的变化，一但store有变化就会执行mapStateToProps函数；

4、这时mapStateToProps函数就会返回一组新的props，这时相当于Props变化了就会走到木偶组件的compoentWillMount()函数进行更新，如果在compoentWillMount函数中调用了setState方法就会重新render，整个应用会重新渲染感知到这个变化。即使compoentWillMount中没有执行setstate也会再走入render进行重绘。

5、有时我们的实现需要connect函数执行后关掉自己的页面，只需要将connect（mapStateToProps，mapDispatchToProps）（xxxPages）中的xxxPages改成当前页面即可，这是connect执行完后会走到当前页面的compoentWillMount和render函数。

无状态组件：

当组件中只有一个render函数的时候，可以用无状态组件替换定义的组件；无状态组件就是一个函数，例如：const noState = (props) => { return (jsx代码) }，无状态组件的性能比较高，函数的执行要比一个类快很多，类中还有生命周期函数等等，性能比较低；

中间件：

redux-thunk:（指的是action和store中间，是对dispatch的一个升级）：redux-thunk(属于redux的中间件，而不是react的):=>github，action正常返回的是一个对象，但是用了redux-thunk后，就可以返回一个函数,函数传递两个参数(dispatch,getState),在函数体内进行业务逻辑的封装，会先执行函数，将结果继续dispatch；注意：将异步请求放到actionGreator中统一管理，会比较方便；

redux-logger: 再action传递给store之前都会再控制台打印出action;

redux-saga: 和redux-thunk一样，可以相互替换，action派发后不久reducers可以接收到，saga也可以接收到，并通过takEvery进行区分，发送请求。