React-Redux之connect

connect函数是连接React组件和Redux  Store，连接操作过程中不会改变原来的组件，而且返回一个已经与Store连接的新组件。

connect常见的两个参数：

1、mapStateToProps(state,[ownProps]),在定义该函数时，组件会监听Store的变化，只要Store发生变化，mapStateToProps函数就会被调用并且必须返回一个纯对象，该对象会和组件的Props合并。mapStateToProps的参数ownProps。表示传递到组件的Props，也就是每次更新Store状态，它接受整个存储状态并且返回一个该组件需要的数据对象。

2、mapDispatchToProps(dispatch,[ownProps]);该参数可以是函数也可以是对象。若是对象的话，那每次定义在该组件上的函数都被当作Redux  action creator,对象定义的方法名作为属性名，每个每个方法都会返回一个新函数，函数中的dispatch方法会把action Creator的返回值作为参数执行，这个参数被合并到组件的props中去。若是一个函数的话，那么在创建组件时调用一次，把dispatch作为参数执行然后再返回一个对象，该对象通过dispatch函数与action Creator以某种方式绑定一起，如果忽略mapDispatchToProps参数，dispatch默认会注入到组件的props中。

const  mapStateToProps = (state,ownProps) => ({})
const  mapDispatchToProps = {}
connect(mapStateToProps,mapDispatchToProps)(component)

 

connect四种连接方式

	不订阅Store	订阅Store
不注入action creator	connect()(Component) Store发生变化时，不重新呈现， 接受到的props.dispatch用在手动调度action	connect(mapStateToProps)(Component) 订阅的napStateToProps从商店中提取值，并且仅仅用在这些值发生改变时重新渲染 接受到的props.dispatch用在手动调度action
注入action creator	connect(null,mapDispatchToProps)(Component) Store发生变化时，不重新呈现 把接收到的mapDispatchProps注入action creator作为props, 并且在调用时自动发送action操作	connect(mapStateToProps,mapDispatchToProps)(Component) 订阅的napStateToProps从商店中提取值，并且仅仅用在这些值发生改变时重新渲染 把接收到的mapDispatchProps注入action creator作为props, 并且在调用时自动发送action操作