Rxjsで複数のイベントから観測可能にするには？

Question

元気？私はRxjsの初心者です。私はどのように異なるイベントから観測可能なものをマージするか分からない。私はVue.js

今イベントはSEARCHKEYの変化からくる

export default { 
    name: 'useraside', 
    data: function() { 
    return { 
     searchKey: '', 
     isPublic: true 
    } 
    }, 
    components: { 
    User 
    }, 
    subscriptions() { 
    return { 
     // this is the example in RxJS's readme. 
     raps: this.$watchAsObservable('searchKey') 
     .pluck('newValue') 
     // .filter(text => text.length > 1) 
     .debounceTime(500) 
     .distinctUntilChanged() 
     .switchMap(terms => fetchRaps(terms, this.userdata._id, this.isPublic)) 
     .map(formatResult) 
    } 
    } 
} 

とRxjsを統合し、今私は、同じ観察可能なときisPublic値の変更をサブスクライブしたいと思います。 searchKeyやisPublicが変更されるたびにラップを取得したいと思います。おかげさまで

Answer 1

マキシムコメントで示唆されているようにあなたは、merge演算子を使用して、あなたのswitchMapでthis.isPublicを使用して保つことができます。

しかし、私はむしろ2つの値をリッスンしてハンドラで消費する素敵な純粋なデータフローに行きたいと思います。あなたがcombineLatestを削除し、のみsearchConfigプロパティを見ることができます

data: function() { 
    return { 
     searchConfig: { 
     searchKey: '', 
     isPublic: true 
     } 
    } 
    }, 

：

Rx.Observable.combineLatest(
    this.$watchAsObservable('searchKey').pluck('newValue'), 
    this.$watchAsObservable('isPublic').pluch('newValue'), 
    ([searchKey, isPublic]) => ({ searchKey, isPublic }) 
) 
.dedounceTime(500) 
.distinctUntilChanged() 
.switchMap(({ searchTerm, isPublic }) => fetchRaps(searchTerm, this.userdata._id, isPublic)) 

やイベントより良いような何かはあなたのような何かに初期データ構造を変更することができます。

この実装の利点は、データフローが純粋であり、外部コンテキストに依存しないことです（this.isPublicは不要です）。すべての依存関係は、データフローの開始時に明示的に宣言されます。

あなたはさらに行きたい場合は、あなたもuserdataを見て、明示的にデータフローをそれを渡すことができます:)