var Home = Backbone.View.extend({
template: _.template($('#home-template').html()),
initialize: function (params) {
this.collection = new BlogList();
this.listenTo(this.collection, "add", this.renderBlog);
this.listenTo(this.collection, "reset", this.render);
},
render: function () {
this.$el.html(this.template({hasPrevious: this.collection.hasPrevious()}));
this.collection.each(function(item) {
this.renderBlog(item);
}, this);
return this;
},
renderBlog: function(item) {
this.$('#blog-list-container').append((new BlogPreView({ model: item })).render().el);
},
BlogPreView是一个Backbone.View 新的BlogPreView被多次实例化。我是否需要删除旧的。
如何删除backbone.view以及如何在此具体示例中删除?
答案 0 :(得分:1)
您应该在视图上调用remove
以删除它们。这会从DOM中移除el
并致电stopListening
以撤消您已拨打的所有listenTo
来电。如果还有其他事情要清理,那么你应该覆盖remove
来清理这些"其他事情"然后调用标准remove
。
在您的情况下,您有子视图,因此您应该跟踪它们:
renderBlog: function(item) {
var v = new BlogPreView({ model: item });
this.previews.push(v); // Initialize this in `initialize` of course.
this.$('#blog-list-container').append(v.render().el);
}
然后在重新渲染或删除之前清理它们:
removePreviews: function() {
_(this.previews).invoke('remove');
this.previews = [ ];
},
render: function() {
this.removePreviews();
// what you have now goes here...
},
remove: function() {
this.removePreviews();
return Backbone.View.prototype.remove.apply(this);
}
您通常可以在不调用remove
的情况下离开,但是一旦发现确实需要它,将代码正确地改编为remove
就会非常麻烦。但是,如果您一直致电remove
,正确跟踪子视图,并根据需要覆盖remove
,那么您将无法在以后进行令人不快的改造时陷入困境。