React-redux 基础

89 阅读1分钟

react - redux 能够使 React 组件从 React store 中很方便的读取数据 ,并且向 store 中分发 actions 来更新数据 。

1 . 两个主要组成部分 Provider 和 connect :

1 . 1 Provider :

用于包裹整个结构 ,让每个组件都可以获取到 store

1 . 2 connect :

如果某个组件需要接收 Provider 提供的 store ,就需要把我们的组件通过 connect 加强 。

2 . connec (参数1 ,参数2)(UI组件) 的使用说明:

2 . 1 参数1 mapStateToProps(state ,myProps)

  • 这个函数允许我们将 store 中的数据作为 props 绑定到组件上 。

  • state :redux 中的 store (状态树)[ 每个reducer 接收的状态]

  • myProps :自己的props

2 . 2 参数2 mapDispatchToProps(dispatch ,myProps)

  • 这个函数允许我们将 action 作为 props 绑定到我们自己的函数中
  • dispatch 就是 store . dispatch( )
  • myProps :自己的props
  • 这个函数返回一个对象 ,写在里面的方法或属性会绑定到 props 身上 。

3 . 加一案例流程图 :

0470.png