Provider:根组件
当前整个项目都在Provider下，作用是可以让store可以供内部任何组件使用（基于上下文完成的），Provider下只能存在一个子元素

import store from './store';
import { Provider} from 'react-redux';
ReactDOM.render(<Provider store={store}>
  <MyRouter />
  </Provider>, document.getElementById('root'));

子组件和redux创建连接需要用到react-redux的connect方法

当你需要在此组件上挂载action方法和reducer中的数据那么久用connect方法
connect(state => ({ ...state.user }), action.user)(Form.create()(AddUser))第一个参数是你需要挂载的reducer，第二个参数是你要挂载的action方法，action被封装成了一个对象，在挂载时需要返回的是对象中的方法，直接挂载对象是无法生效的。比如action中封装的是方法那你可以直接使用action，假如action对象中封装的是对象那么你需要用action.对象取出对象中的方法才能挂载生效，在使用时我们可以在this.props中看到我们挂载的数据和方法

import { connect } from 'react-redux';
import action from '../../store/action'
//=>把redux容器中的状态信息遍历，赋值给当前组件的属性
let mapStateToProps = state => {
    // 需要用到什么就返回什么，把它挂载到当前组件的属性上
    return{
        ...state.user
    }
};
//=>把redux中的dispatch派发行为遍历，也赋值给组件的属性
let mapDispatchToProps = dispatch => {
    return {
        init(initData){
            dispatch(action.user.init(initData))
        }
    }
}

export default connect([mapStateToProps], [mapDispatchToProps])(Form.create()(AddUser));
export default connect(state => ({ ...state.user }), action.user)(Form.create()(AddUser));//简写上面的步骤

当需要redux处理异步请求需要使用中间件redux-thunk再创建store的时候

import { createStore, applyMiddleware, compose } from 'redux';
import reducer from './reducer';
import thunk from 'redux-thunk';
let store = createStore(
    reducer,
    applyMiddleware(thunk)
);
export default store; 

当需要在浏览器上使用redux插件调试

import { createStore, applyMiddleware, compose } from 'redux';
import reducer from './reducer';
import thunk from 'redux-thunk';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
let store = createStore(
    reducer,
    composeEnhancers(applyMiddleware(thunk))
);

export default store; 

一个完成的react-redux流程

store => action-types.js
    export const ADD_USER_ALL = 'ADD_USER_ALL' //创建一个派发行为
======================================================
action => user.js
    import * as TYPES from '../action-types';//引入行为列表
    import {userSeekAll} from '../../api/request';//引入ajax请求列表
    const user = {//user为一个普通对象，存放的方法都是基于以后对user相关的操作
        userSeekAll(){//创建一个获取用户的方法
              return async dispatch => {//因为用到了ajax异步操作需要使用async ,await
                        let userList = await  userSeekAll();//等待执行完成引入的ajax请求函数返回结果后再执行下面步骤，把请求到的数据给变量userList
                        dispatch({//最后把dispatch返回给userSeekAll，当执行userSeekAll()时就开始了派发任务
                           type: TYPES.ADD_USER_ALL,
                           userList
                        })
              }
        }
    }
action => index.js  //合并所有action
  import user from './user.js';
  const action = {
    uesr
  }
export default action;
======================================================
reducer => user.js //管理user状态的容器
import * as TYPES from '../action-types.js';
export default function user(state = {} ,action){//user容器的初始state给了默认值为空对象，action是派发的时候给的参数
     state = JSON.parse(JSON.stringify(state));//不能直接更改原有state，需要深拷贝一份来更改或者用解构赋值拷贝 state = {...state}
      switch (action.type) {//判断是哪个派发行为
        case TYPES.ADD_USER_ALL:
            state.userList = action.userList//把派发行为的值赋值给state
            break;
        default:
            break;
      }
     return state;//最后把state返回
 }
======================================================
reducer => index.js//把每个模块的单独设定的reducer函数最后合并成为总的reducer
import user from './user'；
import { combineReducers } from 'redux';//combineReducers为redux提供的合并reducer的方法
let reducer = combineReducers({
    user
})
export default reducer;
======================================================
store => index.js//最后创建store容器
import { createStore, applyMiddleware, compose } from 'redux';
import reducer from './reducer';
import thunk from 'redux-thunk';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
let store = createStore(
    reducer,
    composeEnhancers(applyMiddleware(thunk))
);

export default store; 
======================================================
最后在根目录的index.js中引入
import store from './store';
import { Provider} from 'react-redux';
ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>, document.getElementById('root'));
在子组件中
import { connect } from 'react-redux';
import action from '../../store/action'
export default connect(state => ({ ...state.user }), action.user)(Form.create()(AddUser));
//state => ({ ...state.user })将user中的状态挂载到当前组件
//action中的user方法挂载到当前组件

注（数据已更新，视图未更新的原因一般都是在reducer中没有克隆state，直接改变了原有state导致视图不正常更新）