Backbone.js和层次结构/树

Question

我正在开发一个需要一个表单的应用程序,该表单允许用户管理任意深度的产品类别层次结构.我可以很容易地将数据放到页面上,但是我有点想知道我需要做些什么才能使这个东西与backbone.js一起工作.基本上,我正在寻找嵌套的UL.当用户选择一个时,我希望他们能够编辑/删除该类别或在其下添加另一个类别.

我无法在线查找案例,其中某人在backbone.js中具有相同数据类型的任意深层次结构.我只是让我的模型类包含我的集合类的实例吗？如何实现储蓄？我知道这是一个广泛的问题,但我主要需要一些关于如何处理这个问题的一般性建议(或者更好的是,某个我没看过的样本).

Answer 1

您可以将树建模为具有父子链接的项集合.所以你的模型应该是这样的:

      id:           id,
      parent_id:    parent_id 

然后使用JS中的递归函数调用从集合构建树.这是一段实时代码:

 function buildTree(branch, list) {
  //recursively builds tree from list with parent-child dependencies
  if (typeof branch == 'undefined') return null;
  var tree = [];
  for(var i=0; i<branch.length; i++)      
    tree.push( {
      item: branch[i],
      children: buildTree( list[ branch[i].id ], list)
    });
  return tree;
}

在使用underscore.js(这是backbone.js的先决条件)之前通过parent_id调用函数组项之前,然后调用:

  var list = _.groupBy(arrayOfItems,'parent_id');
  var tree = buildTree(list[0],list); 

最后,再次使用递归函数调用渲染树(这里没有示例,但我相信你明白了).

PS.如果您指示正确的parent_id,则添加/保存项目不是问题.