REDUX 中间件

redux的基础使用：用户dispatch一个action，reducer计算出新的state，更新视图。

同步操作：用户发出action，reducer立即计算出state，更新视图。异步操作期望的是：发出action，异步操作结束之后，期望自动执行reducer函数，更新视图。这就要使用中间件（middleware）

1.中间件的用法

中间件是在store.dispatch时添加功能。

const store = createStore(
  reducer,
  applyMiddleware(logger)
);

将中间件放在applyMiddleware中，就会对store.dispatch进行改造。applyMIddleware的作用是将各个中间件组成一个数组，依次执行，最后执行store.dispatch()方法，相当于加强了dispatch方法

2.redux-thunk 中间件

dispatch(fetchPosts(selectedPost)) 将异步操作放在dispatch中，正常的dispatch都是只接受一个对象，要想dispatch接收一个异步函数，就要用到redux-thunk。

const fetchPosts = postTitle => (dispatch, getState) => {
  dispatch(requestPosts(postTitle));
  return fetch(`/some/API/${postTitle}.json`)
    .then(response => response.json())
    .then(json => dispatch(receivePosts(postTitle, json)));
  };
};

class AsyncApp extends Component {
  componentDidMount() {
    const { dispatch, selectedPost } = this.props
    dispatch(fetchPosts(selectedPost))
  }

dispatch所带的函数是一个异步函数，该异步函数可以取到dispatch和getState方法，当异步函数返回数据成功后，再执行store.dispatch函数。相当于thunk将函数执行的过程卡在了异步获取数据