javascript - react 和 Redux : Dispatching action not working

Question

我有一个场景，在 api 调用成功后分派(dispatch)一个操作。

axios.get(url)
       .then(response => {
         console.log("RESPONDED", response, dispatch)
         const payload = response
         dispatch(fetchSucess(payload))
       })

fetchSucess 的代码片段:

const fetchSucess = (payload) => (dispatch) => {
  console.log("FETCH SUCCESS HAPPENED", payload)
  return {
    type: someActionTypes.FETCH_ALL_SUCCESS,
    payload,
  }
}

现在奇怪的是 FETCH_ALL_SUCCESS 没有被触发。如果我将 return 替换为 dispatch 那么它就可以工作。为什么当我从 api 回调中调度它时它不起作用？非常感谢您的帮助!

Answer 1

您遇到此问题是因为 fetchSuccess 函数定义错误。如果您仔细观察，您会发现调用 fetchSucess(payload) 返回一个箭头函数:

(dispatch) => {
  console.log("FETCH SUCCESS HAPPENED", payload)
  return {
    type: someActionTypes.FETCH_ALL_SUCCESS,
    payload,
  }
}

当 dispatch 接受一个对象时，fetchSuccess 函数必须返回一个操作对象:

{
    type: someActionTypes.FETCH_ALL_SUCCESS,
    payload,
}

这就是为什么 fetchSuccess 函数应该与此类似:

const fetchSucess = (payload) => {
  console.log("FETCH SUCCESS HAPPENED", payload)
  return {
    type: someActionTypes.FETCH_ALL_SUCCESS,
    payload,
  }
}