Javascript 如何正确使用Backbone.js集合显示列表

Javascript 如何正确使用Backbone.js集合显示列表,javascript,backbone.js,Javascript,Backbone.js,我刚开始学习主干,在一点上感到困惑 我有一个显示文档列表的页面 单击列表中的文档将打开完整文档进行编辑 据我所知,在主干中对该列表建模的正确方法是将其作为文档模型的集合 var DocList = Backbone.Collection.extend({ model: document }); 但是,文档模型将非常大,具有许多属性。列表不需要显示所有这些信息 我想知道是否最好有下面这样的东西 var ShortDoc = Backbone.Model.extend({}); var sho

我刚开始学习主干,在一点上感到困惑

我有一个显示文档列表的页面

单击列表中的文档将打开完整文档进行编辑

据我所知,在主干中对该列表建模的正确方法是将其作为文档模型的集合

var DocList = Backbone.Collection.extend({
  model: document
});
但是,文档模型将非常大,具有许多属性。列表不需要显示所有这些信息

我想知道是否最好有下面这样的东西

var ShortDoc = Backbone.Model.extend({});
var shortDoc = new Doc({ 
  id: id,
  title: docTitle 
});
var DocList = Backbone.Collection.extend({
  model: shortDoc
});
…其中shortDoc仅包含生成列表所需的属性

还是更倾向于使用整个文档模型的集合


(提前)感谢您的帮助

请记住,您可以编写多个
主干。查看同一型号的
s。虽然您可能有一个显示整个文档的
DetailView
,但您也可以自由创建一个
ItemView
,以列表视图的形式展示每个文档的重要部分。虽然您的
DetailView
将包括一个厨房水槽,但
ItemView
可能仅限于展示一个标题:

var MyItemView = Backbone.View.extend({
  tagName: 'li',
  render: function () {
    this.$el.html('<h3>' + this.model.get('title') + '</h3>');
    return this;
  }
});
var MyItemView=Backbone.View.extend({
标记名:“li”,
渲染:函数(){
this.$el.html(“”+this.model.get('title')+“”);
归还这个;
}
});

最后,如果您关心的是数据量:许多主干应用程序选择为应用程序中使用的每种类型的模型保留一个集合。他们的状态需要维持在某个地方;为什么不在一个好的、有条理的列表中呢?加载应用程序时,不需要引导每个模型属性。您可以选择加载标题(或呈现初始列表所需的任何内容),并推迟获取模型,直到用户请求任何详细信息。

问题标题中有3个不同的概念(类、实例和数据表示)

您的定义应该类似于:

var Doc = Backbone.Model.extend({});
var DocList = Backbone.Collection.extend({
    url: '/docs',
    model: Doc
});
如果没有默认值,那么在执行的这个阶段就没有数据。然后,通过在客户端创建模型,开始使用模型填充集合,这些模型可以拥有完整的数据集(或只是其中的一部分):

var myDocList = new DocList();
myDocList.create({title: 'The first doc'}); 
/* no need for an id here if you're using centralized persistence, because 
"create" calls "save" witch in turn does an http post to your server which 
should return a JSON representation of your model including its id (Backbone 
will include it in your model). */
或者在服务器端读取它们:

var myDocList = new DocList();
myDocList.fetch();
/* Backbone will do an http get at DocList.url and create Doc instances with the
   JSON array it should receive from your server*/
至于文档列表的表示,如果它是长的或复杂的HTML,您真的应该将项目附加到新创建的元素,然后将此元素附加到文档中,这可能比为每个项目重新绘制快10倍左右