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

Tom*_*zyk 1 rxjs redux rxjs5 redux-observable

我有这样的史诗:

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)
    );
Run Code Online (Sandbox Code Playgroud)

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

现在我想一遍又一遍(延迟)取出字符,直到取消一些操作.我怎样才能做到这一点?

Ric*_*sen 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))
    );
Run Code Online (Sandbox Code Playgroud)

脚注

严格来说,内在mergeMap()并不保证字符返回的顺序.由于api.fetchCharacter()是异步的,因此fetch可能无序返回(尽管3s的长延迟有助于避免这种情况).

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

Observable.interval(delay)
  .concatMap(x => api.fetchCharacter(store.getState().nextCharacterId) )
Run Code Online (Sandbox Code Playgroud)