react-redux 中的Provider和connect


一、Provider 和connect 的作用

Provider: Provider的作?是从最外部封装了整个应?,并向connect模块传递store connect: 负责连接React和Redux -- 函数签名 connect(mapStateToProps?, mapDispatchToProps?, mergeProps?, options?) --实际上是一个高阶组件  

二、connect 的手动实现(直接上代码)

 

1、先定义这两个方法

 2、实现connect 方法

 

三 Provider (同React中context作用一样)

 

四、工作流程

1、获取state: connect通过context获取Provider中的store, 通过store.getState()获取整个store tree 上所有state 2、包装原组件: 将state和action通过props的?式传?到原组件内部wrapWithConnect返回?个ReactComponent对象Connect,Connect重新render外部传?的原组件WrappedComponent,并把connect中传?的mapStateToProps, mapDispatchToProps与组件上原有的props合并后,通过属性的?式传给WrappedComponent 3、 监听store tree变化: connect缓存了store tree中state的状态,通过当前state状态和变更前state状态进??较,从?确定是否调? this.setState() ?法触发Connect及其?组件的重新渲染