javascript - Rx (RxJS) 网址生成器

Question

我正在寻找一种使用采用多个参数的 RxJS 构建 urlStream 的好方法。

var searchStream = new Rx.ReplaySubject(1);
var pageStream = new Rx.ReplaySubject(1);

var urlStream = new Rx.Observable.create((observer) => {
  //What goes here?
  //Should output something like http://apiurl.com?page=page&search=search
});

我的直觉是使用 Rx.Observable.merge(searchStream, pageStream); 但在你这样做之后你不知道哪个是哪个参数。

有了 searchStream 主题，它允许我在 searchStream.onNext("my search") 的应用程序中的多个位置使用主题，并让它触发数据引用。我见过很多使用一个 url 参数的示例，但还没有看到使用多个输入流的示例。

Answer 1

怎么样:

var searchStream = ...
var pageStream = ...

var urlStream = Rx.Observable.combineLatest(searchStream, pageStream, (search, page) => {
  return baseUrl + `?search=${search}&page=${page}`;
})
.shareReplay(1);

我建议您在创建流时不要直接使用 Subject。可能触发参数更改的任何内容都可以轻松地包装在 Observable 中。

例如，您的搜索可能附加到某个文本框，其更改事件可能包含在 fromEvent

中

//This would create a stream that waits until the user has stopped
//typing for half a second before sending a request to update.
var searchStream = Rx.Observable.fromEvent($textbox, 'keyup')
    .map(e => e.target.value)
    .debounce(500);