Meteor：如何从集合创建响应式树结构

Question

我正在使用最新的Meteor版本，并进行本地部署。 我有一个包含树形结构的集合（文件夹），其中子节点具有父节点ID作为属性。我想在UI树小部件中显示该树。我已经研究了递归模板主题，但是我很难将子节点显示出来。以下是相关的模板和代码。

<template name="sideTreeTemplate">
  <div id="tree" style="height: 200px">
    <h2 class="panel">My Data</h2>
    <ul id="treeData" style="display: none;">
      {{#each treeItems }}
        {{> treeNodeTemplate}}
      {{/each }}
    </ul>
  </div>
</template>


<template name="treeNodeTemplate" >
  <li id="{{id}}" title="{{name}}" class="{{type}}">
    {{name}}
    {{#if hasChildren}}
      <ul>
        {{#each children}}
          {{> treeNodeTemplate}}
        {{/each}}
      </ul>
    {{/if}}
  </li>
</template>

客户端.js代码:

Template.sideTreeTemplate.treeItems = function() {

  var items = Folders.find({"parent" : null});
  console.log("treeItems length=" + items.count());
  items.forEach(function(item){
    item.newAtt = "Item";
    getChildren(item);
  }); 
  return items;

};


var getChildren = function(parent) {
  console.log("sidetree.getChildren called");
  var items = Folders.find({"parent" : parent._id});
  if (items.count() > 0) {
    parent.hasChildren = true;
    parent.children = items;
    console.log(
        "children count for folder " + parent.name +
        "=" + items.count() + ",
        hasChildren=" + parent.hasChildren
    );
    items.forEach(function(item) {
      getChildren(item);
    });
  }
};

树的顶层显示得很好，而且是反应灵敏的，但是没有显示任何子节点，即使对于具有子节点的节点也调用了getChildren函数。我怀疑是服务器同步实际上删除了每个节点的动态添加属性（即hasChildren、children）。在这种情况下，我该如何使反应树工作？或者我的实现有什么其他问题吗？

感谢您的帮助。

- user2680514

---

专业提示：在代码中不要使用制表符，尤其不要在此处粘贴。它们可能会破坏一切。 - Hubert OG

专业提示：如果您想将集合元素用作数组，除了使用 find，还需要使用 fetch，如下所示：var items = Folders.find({parent: parent._id}).fetch(); - Hubert OG

Answer 1

简单的方法是不将子对象作为父对象的属性添加。相反，使用一个辅助函数：

Template.treeNodeTemplate.hasChildren = function() {
  return Folders.find({parent: this._id}).count() > 0;
};

Template.treeNodeTemplate.children = function() {
  return Folders.find({parent: this._id});
};

- Hubert OG

---

谢谢 Hubert。这个很好用！现在我只需要弄清楚如何在响应后保持树形结构的状态(打开/关闭节点)。顺便问一下，“不使用“TAB”是什么意思？这会破坏什么吗？ - user2680514