2

跟进如何构建 rxjs 代码，关于在使用 rx 时如何使用子小部件构建小部件，在子小部件由数据驱动的情况下，您将如何构建 rx 代码？

作为一个玩具问题，假设您有一个外部源（例如 Web 服务）流式传输要观看的股票列表，包括价值、高、低等。所以您有一个 Observable 流，例如（时间下降）：

[{id: 'csco', value: 12, high: 20, low: 10}]

[{id: 'csco', value: 12, high: 20, low: 8}, 
 {id: 'aapl', value: 29, high: 30, low: 20}]

您需要为每个股票代码构建一个小部件。所以必须修改上一个问题中的模式。没有一个孩子，而是根据输入流创建/销毁一个孩子，例如，我们在第一个事件中为“csco”创建一个孩子。在第 2 次事件中，“csco”孩子获得更新（低：8），我们为“aapl”创建了一个孩子。

您可以将子小部件创建移动到订阅：

function widget(state) {
  state = state.share();
  var children = {};
  state.subscribe(function (s) {
    findNew(children, s).forEach(function (stock) {
       children[stock] = subwidget(state.select(findById.bind(null, stock)));
    });
    // ... delete old ones similarly
  });
}

这引入了一个排序问题：孩子没有得到导致它被创建的事件。您可以通过执行类似state.repeat(1), 或的操作来解决此问题state.startsWith(s).select(...)，但它看起来有点奇怪。

假设孩子们也在返回溪流。例如，也许用户操纵孩子们来模拟不同的位置，所以我们想从孩子们那里得到一些计算，并在小部件中显示一个总体总数或其他指标。

您是否在 widget() 中创建了一个主题并将来自孩子的流推送到它上面？喜欢

   var positions = new Rx.Subject();
   positions.mergeAll().subscribe(displayTotal);
   ...
      .. subscribe(function(s) {
       child = subwidget(...)
       children[stock] = child.disposable; 
       positions.onNext(child.position);

这一切看起来都很笨拙。有没有更好的组织方式？我尝试将其建模为一个流，每个孩子一个，并合并输出。这效果不佳。很难跟踪内部订阅，或者从子级输出多个流。

4

0 回答 0