栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

使用fetch代替redux-observable的ajax

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

使用fetch代替redux-observable的ajax

(注意:

RX.DOM.ajax
来自RxJS v4 ,并且不能与
redux-observable
需要RxJS
v5的版本

一起使用。v5中的等效项是
Rx.Observable.ajax
import{ ajax } from 'rxjs/observable/ajax';

确实可以使用

fetch()
以及其他任何AJAX API。虽然有些适应比其他容易!

fetch()
API返回a
Promise
,RxJS v5对此具有 内置支持
。该预期可观察到的最能消耗运营商承诺按原样(如
mergeMap
switchMap
等)。但是通常您需要在将Rx运算符传递到Epic的其余部分之前将Rx运算符应用于Promise,因此,您通常需要将Promise包装在Observable中。

您可以使用以下方法将Promise封装为Observable

Observable.from(promise)

这是一个示例,其中我为用户获取,请求JSON响应,然后将诺言包装在可观察的内容中:

const api = {  fetchUser: id => {    const request = fetch(`https://jsonplaceholder.typipre.com/users/${id}`)      .then(response => response.json());    return Observable.from(request);  }};

然后,您可以在Epic中使用它,并应用所需的任何运算符:

const fetchUserEpic = action$ =>  action$.ofType(FETCH_USER)    .mergeMap(action =>      api.fetchUser(action.payload) // This returns our Observable wrapping the Promise        .map(payload => ({ type: FETCH_USER_FULFILLED, payload }))    );

这是一个带有此工作示例的JSBin:https
://jsbin.com/fuwaguk/edit?js,output


如果您可以控制API代码,则理想情况下,您将使用

Observable.ajax
(或任何其他基于Observable的AJAX
实用程序),因为无法取消Promises。(截至撰写本文时)



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/413419.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号