javascript - Redux 并 promise 进度

Question

我如何处理并 promise redux 的进展？

我想在执行 promise 时显示一些旋转条或其他东西，我正在使用 axios来处理请求，但它们有一个 api 来处理请求的配置对象中的进度，如下所示:

{  
   progress: function(progressEvent) {
       // Do whatever you want with the native progress event
   }
}

但我只能在 redux 操作中发送请求，例如:

return {
    type: "HTTP_REQUEST",
    payload: axios.get("/webAPI/data", configObj)
}

在这些条件下我该如何处理进度事件？

Answer 1

虽然 gabdallah 的答案是正确的，但我觉得它只部分回答了问题。如果您愿意，可以轻松组合两个答案中的代码。

如果您确实想要向用户显示进度，您可以从进度回调中分派(dispatch)特定的进度操作，并将当前进度作为负载。像这样的事情:

{  
   progress: function(progressEvent) {
       return dispatch({
           type: "HTTP_REQUEST_PROGRESS",
           payload: {
               url: "/webAPI/data",
               currentBytes: progressEvent.current,
               totalBytes: progressEvent.total // properties on progressEvent made up by yours truly
           }
       });
   }
}

本质上，您只需要另一个代表请求进度的操作，就像您已经有一个用于发起请求的操作(可能还有一个用于成功和不成功结果的操作)。