2

我正在为 iPad 构建一个 webapp，最近我遇到了一些性能问题。我在左侧有一个新闻列表，在右侧有一个新闻视图。当您点击新闻时，它会在右侧显示完整的新闻。

目前，每次点击新闻时，我都会生成一个新视图。现在我的视图模板对于每个新闻都保持不变，我想知道我是否会通过使用所选新闻内容更新右侧的视图来获得更好的性能，而不是每次都生成一个新视图。

如果是这样，是否有一种用新模型数据或简单的 jQuery 更新视图的主干方式？

4

2 回答 2

1

就性能而言，仅更新部分内容是否值得，可能取决于您的视图有多复杂，以及其中有多少变化。

也就是说，您可以为右侧的新项目提供一个视图，然后只需交换它的模型和or 调用视图上trigger的方法。就像是change eventrefresh

var NewsItemView = BackBone.View.extend({

   initialize: function() {
     this.model.bind('change', this.refresh, this);
   },

   refresh: function () {
     this.$el.find('#partIWantToUpdate').html(this.model.get('someField'));
   }
})

然后而不是创建一个新视图，您只需交换它的模型

newItemView.model = newsModel;
newsModel.trigger('change');

或者只是忘记绑定到更改事件而直接调用该方法

newItemView.refresh();

另一种选择是您可以为每个新闻项目创建一个视图并将该视图缓存在您的集合视图中，然后每次点击一个新闻项目时detach（重要的是您detach而不是remove删除也会删除任何绑定事件）当前视图（DOM实际上是当前视图el）并附加新选择的模型的视图。

于 2012-08-29T14:34:51.980 回答
0

可能很简单：

// code no tested
var NewsView = Backbone.View.extend({
  changeCollection: function( collection ){
    this.collection = collection;
    this.render();
  }
});
于 2012-08-29T10:07:14.397 回答