Redux RxJS AJAX加载指示器

Question

我有一个ReactJS &Redux应用程序，以及使用RxJS进行异步AJAX取消和错误处理。我用来连接Redux和RxJS的中间件是Redux -observable。

我有一个请求服务器也处理错误和取消，这是史诗:

const RecipesEpic = action$ =>
action$.ofType(FETCH_RECIPES)
    .mergeMap(action => {
        return Observable.ajax({
            method: "get",
            url: url
        })
            .map(payload => {
                return ({ type: FETCH_RECIPES_FULFILLED, payload })
            })
            .catch(error => Observable.of({
                type: FETCH_RECIPES_REJECTED,
                payload: error
            }))
            .takeUntil(action$.ofType(FETCH_RECIPES_CANCELLED))
    })
export default RecipesEpic

我正在尝试实现一个加载指示器，首先我想将完成请求的百分比记录到控制台(通过使用XHR2)，然后我将实现UI。简而言之:如何在RxJS DOM请求中实现XHR2下载进度?

我没有在网上找到任何关于这个问题的资源，我希望其他正在搜索这个问题的人能有一个答案。

谢谢!

Answer 1

根据RxJS Ajax文档，你可以在Observable中提供一个progressObserver。ajax调用。您提供的Observer将更新XHR2下载进度!