在redux-observable
中是否可以使用isomporphic-fetch而不是Rx.DOM.ajax ?
最佳答案
(注意:RX.DOM.ajax
来自 RxJS v4,并且不适用于需要 RxJS v5 的 redux-observable
。 v5 中的等效项是 Rx.Observable.ajax
或 import { ajax } from 'rxjs/observable/ajax';
)
确实可以使用 fetch()
以及任何其他 AJAX API;尽管有些人比其他人更容易适应!
fetch()
API 返回一个 Promise
,RxJS v5 对此有内置支持。大多数期望可观察的运算符可以按原样使用 Promises(例如 mergeMap
、switchMap
等)。但通常您会希望在将 Promise 传递给 Epic 的其余部分之前对其应用 Rx 运算符,因此您经常希望将 Promise 包装在 Observable 中。
您可以使用 Observable.from(promise) 将 Promise 包装到 Observable 中
下面是一个示例,我获取用户、请求 JSON 响应,然后将 Promise 包装在可观察对象中:
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 实用程序),因为 Promise 无法取消。 (截至撰写本文时)
关于ajax - 使用 fetch 而不是带有 redux-observable 的 ajax,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38589383/