redux-observable - concat 与 concatMap 的区别

Question

在使用redux-observable时，我试图解决concat和concatMap之间的区别。

在我的直觉中，我认为 concatMap 会起作用： - 从一个FAKE_LOGIN动作中，它将被 switchMap-ed 以发出FAKE_LOGIN_AUTHENTICATING动作。- 在一个FAKE_LOGIN_AUTHENTICATING动作中，它会在FAKE_LOGIN_SUCCESS2 秒的延迟后被concatMap-ed 发出动作。

但是，上面的想法是行不通的。我尝试了各种组合，最后偶然发现了 concat 运算符，令人惊讶的是它有效。

两者有什么区别？

以下是我的代码：

这不工作

action$.pipe(
  switchMap(
    action => of( { type: 'FAKE_LOGIN_AUTHENTICATING' } ).pipe(
      concatMap( thing => {
        return of( { type: 'FAKE_LOGIN_SUCCESS', payload: { userId: 'user-a', userData: {} } } ).pipe(
          delay( 2000 )
        );
      } )
    )
  )
);

但这确实

action$.pipe(
  switchMap(
    action => of( { type: 'FAKE_LOGIN_AUTHENTICATING' } ).pipe(
      concat(
        of( { type: 'FAKE_LOGIN_SUCCESS', payload: { userId: 'user-a', userData: {} } } ).pipe(
          delay( 2000 )
        )
      )
    )
  )
);

Answer 1

我想我不完全理解你的用例，但之间的主要区别concatMap和concat是concatMap接受作为参数调用从源头每个项目，并返回一个内观察，（它的每个项目从源映射到功能一个可观察的）。concatMap然后仅在前一个内部 Observable 完成时调用其回调。

另一方面，concat只接受一个 Observable 列表，并在前一个 Observable 完成时一个接一个订阅它们。

所以在你的情况下，第一个例子只是“映射”FAKE_LOGIN_AUTHENTICATING到FAKE_LOGIN_SUCCESS.

在第二个示例中，内部块等效于：

concat(
  of({ type: 'FAKE_LOGIN_AUTHENTICATING' }),
  of({ type: 'FAKE_LOGIN_SUCCESS', payload: { userId: 'user-a', userData: {}}}).pipe(
    delay(2000),
  )
)

所以它首先订阅of({ type: 'FAKE_LOGIN_AUTHENTICATING' })那个发出并立即完成，然后订阅of({ type: 'FAKE_LOGIN_SUCCESS'...)那个也立即发出然后完成。