Javascript rx数据驱动子部件

接下来，关于在使用rx时如何使用子部件构造小部件，在子部件是数据驱动的情况下，您将如何构造rx代码

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

您需要为每个股票符号构建一个小部件。因此，必须修改上一个问题中的模式。没有一个子项，并且根据输入流创建/销毁一个子项，例如，我们在第一个事件中为“csco”创建一个子项。在第二个事件中，“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）的操作来解决此问题。选择（…）

，但它看起来有点奇怪

假设孩子们也在返回溪流。例如，可能用户操纵子项来模拟不同的位置，因此我们希望从子项中获得一些计算结果，并在小部件中显示总体总数或其他指标

您是否在widget（）中创建一个主题，并将来自子对象的流推送到该主题上？像

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

---

这一切看起来都很笨重。有没有更好的组织方式？我尝试将其建模为一个流，每个孩子一个，并合并输出。这很糟糕。很难跟踪内部订阅，也很难从子项中输出多个流。

好的，我可以证明我以前做过这件事。今晚晚些时候会发。

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