如何将 rxjs takeWhile 运算符与 apollo-client watchQuery 一起使用？

Question

我有一个 Svelte 应用程序，我使用 watchQuery 订阅查询。我想同时使用 rxjs 中的 takeWhile 运算符，但出现此错误：

TypeError: $client.watchQuery(...).takeWhile is not a function

有没有办法可以将takeWhile 与apollo-client 的watchQuery 订阅一起使用？

这是我的代码：

$client.watchQuery({
  query: SomeRandomQuery,
  variables: {},
})
.pipe(takeWhile(() => isAlive))
.subscribe(res => {
 ...
});

我也尝试删除 pipe() 并直接传递它，但得到了同样的错误。

$client.watchQuery({
  query: SomeRandomQuery,
  variables: {},
})
.takeWhile(() => isAlive)
.subscribe(res => {
 ...
});

谢谢

Answer 1

尝试使用 takeUntil

const finalise = new Subject();

$client.watchQuery({
  query: SomeRandomQuery,
  variables: {},
})
.pipe(takeUntil(finalise))
.subscribe(res => {
 ...
});

现在，当您想完成 observable 时，您可以调用 next 主题。

finalise.next();
finalise.complete();

这是我们在 Angular 组件中使用的既定模式，其中单个主体可以在单个 onDestroy 方法中完成所有可观察链。

这样做的好处是 finalize 是一个 observable 并且会在它发出时触发 takeUntil，take 和 takeWhile 不会将 observable 作为参数，并且会一直保持订阅状态，直到 observable 发出导致孤儿订阅。