首页 > Redux Middleware 的一点问题

Redux Middleware 的一点问题

看 Middleware 的文档的时候有点问题:
网址如下:
http://cn.redux.js.org/docs/a...

文后贴出了7个中间件,然后说可以同时使用这7个中间件,但如果同时使用这7个中间件会发生什么事情啊?

比如说这两个中间件:

/**
 * 用 { meta: { delay: N } } 来让 action 延迟 N 毫秒。
 * 在这个案例中,让 `dispatch` 返回一个取消 timeout 的函数。
 */
const timeoutScheduler = store => next => action => {
  if (!action.meta || !action.meta.delay) {
    return next(action)
  }

  let timeoutId = setTimeout(
    () => next(action),
    action.meta.delay
  )

  return function cancel() {
    clearTimeout(timeoutId)
  }
}

/**
 * 通过 { meta: { raf: true } } 让 action 在一个 rAF 循环帧中被发起。
 * 在这个案例中,让 `dispatch` 返回一个从队列中移除该 action 的函数。
 */
const rafScheduler = store => next => {
  let queuedActions = []
  let frame = null

  function loop() {
    frame = null
    try {
      if (queuedActions.length) {
        next(queuedActions.shift())
      }
    } finally {
      maybeRaf()
    }
  }

  function maybeRaf() {
    if (queuedActions.length && !frame) {
      frame = requestAnimationFrame(loop)
    }
  }

  return action => {
    if (!action.meta || !action.meta.raf) {
      return next(action)
    }

    queuedActions.push(action)
    maybeRaf()

    return function cancel() {
      queuedActions = queuedActions.filter(a => a !== action)
    }
  }
}

一个说返回一个取消 timeout 的函数,一个返回移除队列中 action 的函数,那dispatch的时候如果设定了参数的话会直接返回一个取消 timeout 的函数吧,之后时间到了调用下一个不就拿不到移除队列中 action 的函数了么?

先谢谢大家的解答了!

【热门文章】
【热门文章】