react-redux:redux是数据存储和管理的工具,但是想要在react中使用redux,并不能直接将store、action和react组件建立连接,所以就需要react-redux来结合react和redux
Provider:提供的是一个顶层容器的作用,实现store的上下文传递:在原应用组件上包裹一层,使原来整个应用成为Provider的子组件,接收Redux的store作为props,通过context对象传递给子孙组件上的connect
connect:使用connect可以把state和dispatch绑定到react组件,使得组件可以访问到redux的数据。函数最终返回的是将state和dispatch绑定到Connect之后的新组件。
React-Redux 将所有组件分成两大类:UI 组件(presentational component)和容器组件(container component)
UI 组件又称为"纯组件",即它纯函数一样,纯粹由参数决定它的值:特征
- 只负责 UI 的呈现,不带有任何业务逻辑
- 没有状态(即不使用
this.state
这个变量)- 所有数据都由参数(
this.props
)提供- 不使用任何 Redux 的 API
容器组件:
- 负责管理数据和业务逻辑,不负责 UI 的呈现
- 带有内部状态
- 使用 Redux 的 API
React-Redux 规定,所有的 UI 组件都由用户提供,容器组件则是由 React-Redux 自动生成。也就是说,用户负责视觉层,状态管理则是全部交给它