javascript - transports-js と most.js を使用して、Json からストリームへのパイプラインを作成する

Question

私はこのAmdモジュールを持っています

define(function (require, exports, module) {
'use strict';
var t = require("transducers");
var most = require("most");

var groupby = function (prev, curr) {
       var key = curr.type;
       if (!prev[key]) {
             prev[key] = [curr];
       } else {
            prev[key].push(curr);
       }
       return prev;
};
function category(kv) {
     return {
           type: kv[0],
           label: kv[1][0].label,
           counter: kv[1].length
     }
  }
  function dom(cat) {
       var el = document.createElement("li");
       el.innerHTML = cat.label;
       return el;
  }

function append(prev, curr) {
        prev.appendChild(curr);
        return prev;
 }

function createClick(prev, curr) {
     return prev.merge(most.fromEvent("click", curr)
      .map(function (e) {
            return e.currentTarget.innerHTML;
      })
    )
 }

var xf = t.comp(
                 t.map(category),
                 t.map(dom)
               );

module.exports = {
         main: function (data) {

               var groups = t.reduce(groupby, {}, data);
               var container = t.transduce(xf, append, document.querySelector("ul"), groups);
               var streams = t.reduce(createClick, most.empty(), [].slice.call(container.querySelectorAll("li"), 0));

              streams.forEach(function (e) {
                   console.log("click", e);
               });
        }
     };
});

メイン関数は項目のリストを受け取り、それらを「type」プロパティでグループ化します。その後、 < li > 要素を作成して追加します。最後に、クリックのストリームを作成します。私はリアクティブプログラミングとトランスデューサーの初心者です。

しかし、パイプラインを作成する方法があるかどうか疑問に思っていました。

groupby はリダクションでトランスデューサで合成できないので困っています。私は何かが欠けていると確信しています。ありがとう