在Backbone中表示任意深度嵌套列表的最简单方法

时间:2013-01-06 23:30:15

标签: javascript jquery backbone.js hierarchical-data nested-lists

我是Backbone的新手。我有一个任意深度的嵌套列表,列表中的每个节点都可能有一个子集合。例如:

item 1
  item a
    item i
    item ii
  item b
  item c
item 2
item 3
etc

我想知道使用Backbone表示此数据结构的最简单方法是什么。

如果重要,我在最初加载整个结构或在需要时加载每个级别之间没有偏好。无论什么是最简单的。

我不想走Backbone-Relational的路线,因为我觉得这样的事情有点过分。

先谢谢你的帮助。

2 个答案:

答案 0 :(得分:0)

我会创建一个简单的模型,可能将默认属性children设置为new Collection(如果需要)。主要部分是从JSON数据加载到模型。

var MyModel = Backbone.Model.extend({

});
var MyCollection = Backbone.Collection.extend({
    model: MyModel,
    load: function(data) {
        for(var i in data) {
            if (_.isString(data[i])) {
                this.add(new MyModel({
                    title: data[i]
                }));
            } else {
                var collection = new MyCollection();
                collection.load(data[i]);
                this.add(new MyModel({
                    title: i,
                    children: collection
                }));
            }
        }
    }
});

var collection = new MyCollection();
collection.load({
    'item1': {
        'item a': ['item i', 'item ii'],
        0: 'item b',
        1: 'item c'
    },
    0: 'item2',
    1: 'item3'
});
console.log(collection);

只有在此示例中带有“0”和“1”键的项目才能进入集合的开始,但您可以看到这个想法。

答案 1 :(得分:0)

假设您的数据结构类似于此

[
  {
    title: "item 1",
    nodes: [
      {title: "item a",
        nodes: [
          {title: "item i"},
          {title: "item ii"}
        ]
      },
      {title: "item b"
      }
    ]
  },
  {
    title: "item 2"
  }
]

您可以通过覆盖模型的解析方法来设置层次结构:

var Node = Backbone.Model.extend({
  parse: function(data) {
    this.nodes = new Nodes(data.nodes, {parse: true});
    return _.omit(data, 'nodes');
  }
});

var Nodes = Backbone.Collection.extend({
  model: Node
});

var c = new Nodes(data_structure, {parse: true}); 
// parse: true is only needed if you pass the data as an argument

Node.parse从数据哈希中提取nodes属性以在对象上构建自定义属性,然后返回其余属性以让Backbone处理其他属性。然后,您使用model.nodes访问该集合。和http://jsfiddle.net/C8HGY/

一起玩的小提琴