redux-observable 的 Rxjs。重复动作

Question

我有这样一部史诗：

export const fetchCharacter = (id) =>
  ajax({ url: `https://swapi.co/api/people/${id}` })
    .map(response => fetchCharacterSuccess(response.body))
    .catch(error => Observable.of(fetchCharacterFailure(error.response.body)));

export const startFetchingCharacters = () => ({ type: START_FETCHING_CHARACTERS });

export const fetchUserEpic = (action$, store) =>
  action$.ofType(START_FETCHING_CHARACTERS)
    .delay(3000)
    .mergeMap(
      action => api.fetchCharacter(store.getState().nextCharacterId)
    );

现在它只监听 START_FETCHING_CHARACTERS 操作并为用户发出一个请求。

现在我想一遍又一遍地（有延迟地）获取字符，直到执行某些取消操作。我怎样才能做到这一点？

Answer 1

将一个 .interval() observable 映射到 api 获取（或 .timer() 取决于您想要的确切延迟模式）。

用 takeUntil() 停止它。

const delay = 3000
const fetchUserEpic = (action$, store) =>
  action$.ofType(START_FETCHING_CHARACTERS)
    .mergeMap( action => 
      Observable.interval(delay)
        .mergeMap(x => api.fetchCharacter(store.getState().nextCharacterId) )
        .takeUntil(action$.ofType(STOP_FETCHING_CHARACTERS))
    );

脚注

严格来说，内mergeMap()不保证字符return的顺序。由于 api.fetchCharacter() 是异步的，因此 fetch 到 return 的顺序可能是乱序的（尽管 3 秒的长延迟有助于避免这种情况）。

在内部 Observable 上使用 concatMap() 确保发射以严格的 nextCharacterId() 顺序发生。

Observable.interval(delay)
  .concatMap(x => api.fetchCharacter(store.getState().nextCharacterId) )

redux-observable 的 Rxjs。重复动作

Rxjs with redux-observable. Repeat action

rxjs

redux

rxjs5

redux-observable