【问题标题】:react redux middleware dispatch 2 actions反应 redux 中间件调度 2 个动作
【发布时间】:2016-08-30 06:52:30
【问题描述】:

下面作为动作创建者的第一个块与 thunk 一样工作,但我还想应用第二个块,它是一个承诺中间件。如何调整它以便它可以调度 2 个动作?

export const fetchPokemon = function (pokemonName) {
  return function (dispatch) {
    dispatch({type: 'REQUESTING'})
    const requestURL = `http://pokeapi.co/api/v2/pokemon/${pokemonName}/`
    return fetch(requestURL)
    .then(function (response) {
      return response.json()
    })
    .then(function (data) {
      dispatch(receivePokemon(formatPokemonData(data)))
      dispatch(fetchPokemonDescription(pokemonName))
    })
  }
}

中间件

const fetchPromiseMiddleware = store => next => action => {
  if (typeof action.then !== 'function') {
    return next(action)
  }
  return Promise.resolve(action).then(function (res) {
    if (res.status >= 400) {
      throw new Error("Bad response from server")
    }
    return res.json()
  }).then(store.dispatch)
}

我尝试了以下方法,但出现错误:

store.js:33 Uncaught (in promise) TypeError: (0 , _actionCreators.receivePokemon) 不是函数

const fetchPromiseMiddleware = store => next => action => {
  if (typeof action.then !== 'function') {
    return next(action)
  }
  return Promise.resolve(action).then(function (res) {
    if (res.status >= 400) {
      throw new Error("Bad response from server")
    }
    return res.json()
  }).then(function (data) {
    return store.dispatch(receivePokemon(formatPokemonData(data)))
  }).then(function (data) {
    return store.dispatch(fetchPokemonDescription(data.name))
  })
}

【问题讨论】:

  • 你能展示你剩下的动作吗?

标签: javascript reactjs redux middleware react-redux


【解决方案1】:

您的问题中没有足够的代码,但是当您在显示的代码中调用 receivePokemon(formatPokemonData(data)) 时,receivePokemon 不是函数,现在您需要检查定义的位置,它可能不是.

【讨论】:

    猜你喜欢
    • 2019-12-24
    • 1970-01-01
    • 2018-07-04
    • 2017-05-14
    • 1970-01-01
    • 1970-01-01
    • 2019-02-07
    • 2018-01-26
    • 1970-01-01
    相关资源
    最近更新 更多