redux-thunk 安装使用，以及 redux-devtools 配置

1、redux-thunk 安装  （redux-thunk 是一个 Redux的中间件）

npm install redux-thunk --save
// 或者 
yarn add redux-thunk 

2、在创建 store 时,使用 redux, redux-thunk 配置 redux-devtools　

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

const composeEnhancers =
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({}) : compose;

const enhancer = composeEnhancers(
  applyMiddleware(thunk)
);

const store = createStore(reducer, enhancer);

export default store;　　

3、在 actionCreator 创建 action ，就可以使用函数作为返回值了

export const getTodoList = () => {
  // 这里可以接收 dispatch 参数，直接使用，相当于调用 store.dispatch 方法
  return (dispatch) => {
    axios.get('/api/todolist')
      .then((res) => {
        const data = res.data
        const action = getInitListAction(data)
        dispatch(action)
      })
      .catch((error) => {
        console.log(error)
      })
  }
}　　

4、在 componentDidMount 钩子函数中调用 action

componentDidMount() {
   const action = getTodoList()
   store.dispatch(action)
  }　

5、redux 接收传值，处理改变 state

export default (state = defaultState, action) => {

  if (action.type === INIT_LIST_ACTION) {
    const newState = JSON.parse(JSON.stringify(state))
    newState.list = action.data;
    return newState;
  }
  
  return state;
}