在redux-observable是否有可能使用isomporphic取的,而不是Rx.DOM.ajax?
redux-observable
(注意:RX.DOM.ajax来自RxJS v4 ,并且不能与redux-observable需要RxJS v5的版本 一起使用。v5中的等效项是Rx.Observable.ajax或import { ajax } from 'rxjs/observable/ajax';)
RX.DOM.ajax
Rx.Observable.ajax
import { ajax } from 'rxjs/observable/ajax';
确实可以使用fetch()以及其他任何AJAX API。虽然有些适应比其他容易!
fetch()
该fetch()API返回a Promise,RxJS v5对此具有 内置支持 。该预期可观察到的最能消耗运营商承诺按原样(如mergeMap,switchMap等)。但是通常您需要在将Rx运算符传递到Epic的其余部分之前将Rx运算符应用于Promise,因此,您通常需要将Promise包装在Observable中。
Promise
mergeMap
switchMap
您可以使用以下方法将Promise封装为ObservableObservable.from(promise)
Observable.from(promise)
这是一个示例,其中我为用户获取,请求JSON响应,然后将诺言包装在可观察的内容中:
const api = { fetchUser: id => { const request = fetch(`https://jsonplaceholder.typicode.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。(截至撰写本文时)
Observable.ajax