javascript 表示树数据的主干集合
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6026752/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Backbone collections representing tree data
提问by user732456
I want to load json data in form of a tree into Backbone Collection. I can't do this. Can anyone explain what I'm doing wrong?
我想以树的形式将 json 数据加载到 Backbone 集合中。我不能这样做。谁能解释我做错了什么?
My very simple model:
我非常简单的模型:
CTreeDataItem = Backbone.Model.extend(
{
});
CTreeDataItems = Backbone.Collection.extend(
{
model: CTreeDataItem
});
And my load attepmt:
我的负载尝试:
var treeJs =
[
{ id: "tvRoot", title: 'Root', cssClass: 'root',
items: [
{ id: "ti1", title: 'Item1', cssClass: 'item',
items: [
{ id: "ti11", title: 'SubItem11', cssClass: 'subitem'},
{ id: "ti12", title: 'SubItem12', cssClass: 'subitem'}]},
{ id: "ti2", title: 'Item2', cssClass: 'item',},
{ id: "ti3", title: 'Item3', cssClass: 'item',
items: [
{ id: "ti31", title: 'SubItem31', cssClass: 'subitem'},
{ id: "ti32", title: 'SubItem32', cssClass: 'subitem'},
{ id: "ti33", title: 'SubItem33', cssClass: 'subitem'}]}]
}];
this.TreeData = new CTreeDataItems();
this.TreeData.add(treeJs);
回答by Stoive
Try representing the tree with Model
as the node and each node containing a Collection
of its child nodes:
尝试用Model
as 节点表示树,每个节点包含Collection
其子节点:
var CTreeDataItem = Backbone.Model.extend({
initialize: function() {
if (Array.isArray(this.get('items'))) {
this.set({items: new CTreeDataItemChildren(this.get('items'))});
}
}
});
// children collection
var CTreeDataItemChildren = Backbone.Collection.extend({
model: CTreeDataItem
});
// create
var treeData = new CTreeDataItemChildren(treeJs);
// access
treeData.at(0).get('items').at(1).get('title')
// returns "Item2"
EDIT 2011-05-18:If you want to flatten the tree and maintain a reference to the parent that each node had in the tree:
编辑 2011-05-18:如果要展平树并维护对每个节点在树中的父节点的引用:
// flatten the tree outside of Backbone. Alternatively,
// you could override the constructor of the CTree collection
// to provide encapsulation
function flatten(parentID, arr) {
var out = [];
for (var i = 0; i < arr.length; i++) {
var node = arr[i];
node.parentID = parentID;
out.push(node);
if (Array.isArray(node.items))
Array.prototype.push.apply(out, flatten(node.id, node.items));
delete node.items;
}
return out;
}
// remove above code that would have provided nesting
var CTreeDataItem = Backbone.Model.extend({});
// children collection, as before
var CTreeDataItemCollection = Backbone.Collection.extend({
model: CTreeDataItem
});
// create
var treeData = new CTreeDataItemChildren(flatten('', treeJs));
// as before, but now there's the 'parentID' FK
treeData.at(3).get('parentID')
// returns "ti1"
Hope that's what you're after.
希望这就是你所追求的。
回答by Tom Tu
You need to use Backbone.Model parsemethod which is used to parse data before it gets passed to a model. You can use it to turn data on each level of your tree to Collections and Models representing items on these collections.
您需要使用Backbone.Model 解析方法,该方法用于在将数据传递给模型之前解析数据。您可以使用它来将树的每个级别上的数据转换为代表这些集合中项目的集合和模型。
Then when saving you'd have to override the toJSON
method on the Model to return the json representation of your data the same way you receive it. It is later on used by Backbone.sync to send the data back to the server. By default it returns only _.clone
of your Model.attributes
and you want all the Collections and CollectionModels in there as well.
然后在保存时,您必须覆盖toJSON
模型上的方法,以与接收数据的方式相同的方式返回数据的 json 表示。Backbone.sync 稍后使用它来将数据发送回服务器。默认情况下,它仅返回_.clone
您的Model.attributes
并且您还希望在其中包含所有 Collections 和 CollectionModels。
All hail the backbone! :)
向骨干致敬!:)