Backbone.js和层次结构/树

我正在研究一个需要表单的应用程序，该表单允许用户管理产品类别的层次结构，以达到任意深度。我可以很容易地将数据获取到页面上，但是我为了使这种事情与backbone.js一起工作需要做些什么而有点失落。基本上，我正在寻找嵌套的UL。当用户选择一个时，我希望他们能够编辑/删除类别或在其下添加其他类别。Backbone.js和层次结构/树

我很难在网上找到有人在backbone.js中拥有相同数据类型的任意深层次结构的情况。我只是让我的模型类包含我的集合类的一个实例？如何完成储蓄？我知道这是一个广泛的问题，但我主要需要一些关于如何解决这个问题的一般性建议（或者更好的是，我还没有看过一个示例）。

来源

2011-10-07 Will Gant

叶元素是产品本身？ – papdel

我没有想过这样做，但现在你提到它，它会使界面更加可用。我现在只是试图去管理类别层次结构。 –

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

 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，则添加/保存项目不会成为问题。

来源

2011-12-15 16:15:51

伟大的解决方案，谢谢！ – Casey

你可以在这个链接找到答案。

Backbone with a tree view widget

你有很多方法来创建分层树。其中之一，我张贴在我的问题。如果你想，试试吧！我使用Backbone.js和Epoxy.js来创建它。链接Epoxy.js

http://epoxyjs.org/index.html

该库提供您轻松绑定不同的事件包含什么树

来源

2013-12-18 09:03:59 Alexey

Backbone.js和层次结构/树

回答

相关问题