首页 文章

具有redux-observable的Rxjs . 重复动作

提问于
浏览 次
1

我有这样的史诗：

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 动作并为用户发出 one 请求 .

现在我想一遍又一遍（延迟）取出字符，直到取消一些操作 . 我怎样才能做到这一点？

redux rxjs rxjs5 redux-observable

1 回答

  • 5

    将 .interval() observable映射到api fetch（或 .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))
    );

    Footnote

    严格来说，内部 mergeMap() 并不保证字符返回的顺序 . 由于 api.fetchCharacter() 是异步的，所以's possible for fetch's无序返回（尽管3s的长延迟有助于避免这种情况） .

    在内部observable上使用 concatMap() 可以确保以严格的 nextCharacterId() 顺序发生 .

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

相关问题