react依赖注入之mapStateToProps&&mapDispatchToProps

今天看前辈写的代码，看到mapStateToProps&&mapDispatchToProps处，不明白，于是又是各种找资料，在CSDN博客中发现一篇好文，摘抄到此，方便自己阅读！

原文如下：http://blog.csdn.net/genius_yym/article/details/64130120

在react-redux开发中每个模块有自己的state用来统一管理视图数据

（1）将需要的state的节点注入到与此视图数据相关的组件上

使用 React Redux 库的 connect() 方法来生成容器组件前，需要先定义 mapStateToProps 这个函数来指定如何把当前 Redux store state 映射到展示组件的 props 中。

 

（2）将需要绑定的响应事件注入到组件上

除了读取 state，容器组件还能分发 action。类似的方式，可以定义mapDispatchToProps() 方法接收 dispatch() 方法并返回期望注入到展示组件的 props 中的回调方法。它可以是一个函数，也可以是一个对象。如果mapDispatchToProps是一个函数，会得到dispatch和ownProps（容器组件的props对象）两个参数。

 

 

（3）统筹mapStateToProps和mapDispatchToProps

 

最后，说一下react-redux开发的基本结构。

开发环境调用后台路径配置：`proxy.config.js`文件下可以自由定义接口调用到的后台地址，业务模块不要出现应用路径(BackGround)；各个模块目录下：- api.js定义与后台交互的接口方法- action.js定义页面操作触发的动作(eg. 点击查询按钮)- reducer.js定义触发动作后的影响(eg. 查询完成后将查询结果set回state，视图自动刷新)

补充：自己项目实例（aec-app）：