backbone.js - Backbone - 一个模型的视图很少

Question

请您帮我提供最佳实践吗？

我有一个从服务器返回的对象列表。都具有相同的属性。一些属性的值并不总是相同的（例如属性“isBig”可以是“true”/“false”）。根据属性值的组合，应用程序决定在页面上绘制“bigBox”还是“smallBox”。

页面视图应包含一组框。

我想应该有一个“bigBox”视图和一个“smallBox”视图，对吗？我还应该保留两个模型吗？它们完全相同（除了它们的值......）我可以从模型中选择视图吗？

请指导我？

谢谢。

Answer 1

是的，我认为你在正确的轨道上。您的数据都是相同的，因此您只有 1 个模型和单独的视图，具体取决于您希望如何显示该数据

我会建议：

• 1个模型（盒）
• 1 个系列（盒）
• 3 个视图（1 个“包含”视图用于您的集合 (BoxesView)，1 个视图用于 bigBox (BigBoxView)，1 个视图用于 smallBox (SmallBoxView)）

在 BoxesView 的渲染函数中，当您遍历集合时，检查 IsBig，并相应地渲染每个视图。

//render function of BoxesView. Make sure to have a reference to 
//your Boxes collection
render: function() {
   var that = this;
   this.collection.each(function(model) {
       //depending on the isBig property render a different view
       if(model.get("isBig") === true) 
           var bigView = new BigView({
               model: model
           });
           that.$el.append(bigView.render().el); 
           // $el is the element you want to append all your boxes into 
        else {
           var smallView = new SmallView({
               model: model
           });
           that.$el.append(smallView.render().el);
        }
   }
}

或者，根据 bigBox 和 smallBox 的行为相似程度（它们是否显示完全相同的信息并具有完全相同的操作），只有一个 BoxView 并在构建视图时传入不同的模板可能是有意义的.