Question

我一直在尝试使用Redux observable和Redux操作正确使用rxjs。我尝试过调用以下函数的许多不同组合，每种可能的组合都给了我不同的错误。

基本上，我有两个可以在我的应用中发送的操作：SET_CIRCULAR_DATA和SET_MODAL_OVER_DEEP_LINK_FLAG。

我想要发送另一个操作，determineFoundInProducts()在SET_MODAL_OVER_DEEP_LINK_FLAG发生后跟第一个（成功）SET_CIRCULAR_DATA操作。在SET_CIRCULAR_DATA再次发生之前，应忽略任何后续SET_MODAL_OVER_DEEP_LINK_FLAG操作。由于这种需要，我觉得withLatestFrom()最有意义。我还认为takeUntil()和repeat()可能有助于我完成我需要的工作，虽然我没有将它们包含在此代码示例中，因为我被困在withLatestFrom()部分

我尝试过使用switchMap，map，mapTo的不同管道组合，而不是管道，但似乎没有任何效果。我正在导入所有使用过的rxjs函数，我在根处组合了史诗，所以它不可能。我似乎无法得到正确的组合，以免错误。

错误的一些例子是

动作必须是普通对象。使用自定义中间件进行异步操作。
您提供了“未定义”，其中包含预期的流

我正在使用RXJS ^ 5.5.6和Redux Observable ^ 0.17.0。

import 'rxjs';
import { Observable } from 'rxjs/Observable';
import { withLatestFrom, map, tap, mergeMap } from 'rxjs/operators';
import ....all the types and actions

export const handleProductDetailsModalOnLoginRedirect = (action) =>
  action.ofType(weeklyAdTypes.types.SET_CIRCULAR_DATA).pipe(
    withLatestFrom(
      action.ofType(navigationTypes.types.SET_MODAL_OVER_DEEP_LINK_FLAG)
    ),
    mergeMap(([first, second]) => {
      console.log(first, second);
      return determineFoundInProducts();
    })
  );

修改

我在原帖中苦苦挣扎，以确定代码的哪一部分正在破坏。我遇到的问题是redux可观察动作无法与rxjs函数通信。我发现管道适当地用管道（双关语）可以使用rxjs函数。这就是我所做的。

action.ofType(navigationTypes.types.INIT_REDIRECT_MODAL_LOGIC)
  .switchMap(() =>
    action.ofType(weeklyAdTypes.types.SET_CIRCULAR_DATA)
    .withLatestFrom(action.ofType(navigationTypes.types.SET_MODAL_OVER_DEEP_LINK_FLAG))
      .take(1)
      .pipe(
        map(([first]) => {
         // Do stuff
         return determineFoundInProducts();
      }))
    )

Answer 1

答案取决于在任何SET_MODAL_OVER_DEEP_LINK_FLAG操作之前调度多个SET_CIRCULAR_DATA操作时您想要发生什么，以及它们是否应该与某些唯一ID或如何配对？不

听起来很可能就像你正在寻找exhaustMap。

exhaustMap运算符基本上与switchMap相反。它将输入映射到内部可观察并平展其输出，忽略其他输入值，直到可观察完成。它耗尽内部Observable。

在您的使用案例中，这意味着我们首先听取SET_MODAL_OVER_DEEP_LINK_FLAG，然后我们会听取一个SET_CIRCULAR_DATA，但是当我们等待后续SET_CIRCULAR_DATA时，我们会忽略所有可能的传入SET_MODAL_OVER_DEEP_LINK_FLAG动作。请注意，take(1)很重要，否则我们会监听每个 SET_CIRCULAR_DATA的流，而不只是一个。

export const handleProductDetailsModalOnLoginRedirect = (action) =>
  action.ofType(navigationTypes.types.SET_MODAL_OVER_DEEP_LINK_FLAG)
    .exhaustMap(() => 
      action.ofType(weeklyAdTypes.types.SET_CIRCULAR_DATA)
        .take(1)
        .map(() => determineFoundInProducts())
    );

请问Redux Observable问题实际上只是RxJS问题，这很常见。这是一个很酷的事情需要注意，因为RxJS社区大量所以你会在其上找到更多的TON资源，并且如果你有更好的机会获得帮助能够重新解释与Redux Observable无关的问题 - 例如将ofType('TYPE')更改为filter(d => d.type === 'TYPE')

Answer 2

以上答案肯定会帮助他人。但是，我苦苦挣扎的是要有可观察到的Redux动作与RXJS函数进行通信。请查看我对原始帖子的修改以获取解决方案。

withLatestFrom使用两个Redux动作

修改

2 个答案: