redux - Redux 的 applyMiddleware 的实现

Question

我的问题是为什么middlewareAPI不能使用：

const middlewareAPI = {
  getState: store.getState,
  dispatch: dispatch
}

替换源代码中的定义如下：

export default function applyMiddleware(...middlewares) {
  return (createStore) => (reducer, preloadedState, enhancer) => {
    const store = createStore(reducer, preloadedState, enhancer)
    let dispatch = store.dispatch
    let chain = []

    const middlewareAPI = {
      getState: store.getState,
      dispatch: (...args) => dispatch(...args)   // why not just use `dispatch: dispatch`
    }
    chain = middlewares.map(middleware => middleware(middlewareAPI))
    dispatch = compose(...chain)(store.dispatch)

    return {
      ...store,
      dispatch
    }
  }
}

谁能告诉我区别？谢谢。

Answer 1

这是一个有点复杂的 JS 变量作用域/托管组合，需要确保传入的 dispatch 方法实际上指向中间件链的起点。

请参阅新添加（尚未发布）的Redux FAQ 条目，了解为什么applyMiddleware使用闭包以获取更多详细信息。