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

Simplest way to represent an arbitrarily deep nested list in Backbone

本文关键字:列表 最简单 方法 嵌套 深度 Backbone 表示 任意      更新时间:2023-09-26

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

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

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

如果它很重要,我不会优先加载整个结构,还是加载每个需要的级别。

我宁愿不走骨干关系的路线,因为我有一种感觉,这是多余的。

(提前)感谢您的帮助。

假设您的数据结构看起来像这样

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

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

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/

我会制作一个简单的模型,可能将默认属性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"answers"1"的项会被放到集合的开头,但是您可以看到这个想法。