react-redux提供了Provider 和connect

安装使用

如果不加--save 也是安装在dependencies中
安装redux：npm install --save redux
安装react-redux：npm install --save react-redux

思想

1、<Provider />组件，使 store通过props传递给子组件，不管层级、（相对于redux，省去了store.subscribe）

import { Provider } from 'react-redux'
import store from './store'
import App from './App'

<Provider store={store}>
    <App />
  </Provider>

2、connect方法 通过mapStateToProps获取store的对应值，通过mapDispatchToProps ，改写store的值
react-redux 将组件分为2部分，UI组件和容器组件，UI组件渲染页面，容器组件是数据交互。
const Container = connect()(OurComponent);
UI组件：OurComponent
容器组件：Container
connect函数没有传递参数，不能读取store ，也不能更改store
const Container = connect(mapStateToProps,mapDispatchToProps)(Component);
mapStateToProps是个函数，将接收的state作为props传递给子组件，返回的是个对象（与redux相比，不用getState取值）
mapDispatchToProps 可以是个函数可以接收dispatch参数，返回action生成器名字对应的key的对象。；也可以是个对象（与redux相比，处发diapatch更简单）

import {connect} from 'react-redux';
// action 构造器函数集合js
import {setActiveNode, setViewShow} from './actions';
//将state映射为子组件的props中
const mapStateToProps = state => ({
    activeNode: state.activeNode,//reducer.js中的值
    viewShow: state.viewShow,
});
//将Action的构造函数映射为子组件的props中
const mapDispatchToProps = dispatch => ({
    setActiveNode: (id) => {
        dispatch(setActiveNode(id));
    },
    setViewShow: (show) => {
        dispatch(setViewShow(show));
    },
});

//子组件从props中获取state中的值
const {activeNode, viewShow, } = this.props;
//子组件通过props改写state中的值
this.props.setActiveNode(12)；