Redux中间件,thunk？

我直接从Redux文档中得到了这个:

const logger = store => next => action => {
  console.group(action.type)
  console.info('dispatching', action)
  let result = next(action)
  console.log('next state', store.getState())
  console.groupEnd(action.type)
  return result
}

现在,我知道如何使用承诺,但是thunks ......我有点失落.

为什么他们要做到以下几点:store => next => action =>？

在关于中间件的redux文档中,您可以看到ES6箭头函数链:

logger = store => next => action =>

在翻译为ES5时看起来像这样:

function logger(store) { // this is not the store, just an object with getState and dispatch
  return function wrapDispatchToAddLogging(next) {
    return function dispatchAndLog(action) {
      console.log('dispatching', action)
      let result = next(action)
      console.log('next state', store.getState())
      return result
    }
  }
}

为什么我们需要一个返回函数的函数:

这称为部分应用程序,您可以在本文中阅读更多相关内容.

基本的想法是,如果你需要为一个函数提供3个参数,但是你现在只有1个参数,1个稍后,而第3个将在远期,你可以按顺序应用参数可用,而不是一次.每次应用参数时,都会得到一个新函数,该函数的上下文中包含参数"stored".

在Redux

中间件需要部分应用,因为创建中间件链有几个步骤:

注意:这是传递给第一个参数的实际"存储":

const middlewareAPI = {
  getState: store.getState,
  dispatch: (action) => dispatch(action)
}

迭代中间件的数组,调用每个函数并为每个函数(store =>param)提供middlewareAPI :

chain = middlewares.map(middleware => middleware(middlewareAPI))

组成中间件数组:

dispatch = compose(... chain)(store.dispatch)

并且在编写时将每个中间件作为next =>参数传递dispatch给它之前的那个,并传递给最后一个:

return funcs.reduce((a,b)=>(... args)=> a(b(... args)))

现在,中间件是一个只有一个参数的简单函数action =>,每当一个动作传递到中间件链时,action =>每个中间件的功能都会被当前动作调用.