作用

  • 避免数据层层传递

  • 封装了 dispatch subscribe 的过程

    安装

    1. yarn add react-redux

    使用

    Provider：接受一个 store，而不是直接在父组件上传递 store

  • 父组件 ```javascript import { Provider } from ‘react-redux’;

ReactDOM.render( , document. getElementById(‘root’) ）

  1. <a name="kjO9Z"></a>
  2. #### connect：调用两次，第一次接受一个返回 `state` 的函数（或对象）和返回 `action` 对象的函数（或对象）；第二次接受一个组件。会将 state 和 action 合并到组件的 props 上
  4. - 返回一个 action 对象后会自动 `dispatch`，不用手动 `dispatch`
  5. - 子组件
  6. ```javascript
  7. import { connect } from 'react-redux';
  8. const App = (props) => {
  9.     return (
  10.       <div>{props.n}</div>
  11.   )
  12. }
  13. function mapStateToProps({n}){
  14.   return {n}
  15. }
  16. const mapDispatchToProps = (dispatch)=> {
  17.   return {
  18.     add1:（）=> dispatch({type: 'add', payload: 1))
  19.   }
  20. }
  21. export default connect(mapStateToProps, mapDispatchToProps)(App)