具有vue-rx / rxjs的VUE：如何使用$ watchAsObservable使用过滤器和间隔创建订阅

问题描述

在以下vue-rx / RxJs问题中，我需要帮助。

我必须在vue-rx中进行订阅以监视道具值，当该订阅为true时，它将每500 ms调用一次http请求，并在该请求为false或返回值为'时停止它。已完成”。

我尝试过这样的事情：

export default {
  props: ['started'],subscriptions() {
   return {
    currentHttpState: this.$watchAsObservable('started')
                      .pipe(pluck('newValue'),filter(value => value === false))
                      .switchMap(() => interval(500).pipe(switchMap(() => this.callHttpRequest()),distinctUntilChanged())),

谢谢您的帮助！

解决方法

我对vue（或vue-rx）不太熟悉，所以这可能只是答案的一半（RxJS位）。

我假设this.$watchAsObservable('started')和pluck('newValue')是true和false的流？ （反映了started道具的价值）

如果是这样，我将使用switchMap在时间间隔/计时器之间切换，而不进行任何操作。

currentHttpState: this.$watchAsObservable('started').pipe(
  pluck('newValue'),map(val => val? timer(0,500) : EMPTY),switchMap(timer$ => timer$.pipe(
    switchMap(_ => this.callHttpRequest()),takeWhile(result => result.status !== 'COMPLETED')
  )
)

第二个switchMap的效果是，如果一次呼叫花费500毫秒以上才能完成，它将被丢弃，您将永远看不到结果。如果不满足takeWhile()条件，这也将取消订阅-因此，您必须更改它以满足您的特定要求。