レンダリング時にレンダリングされる独自の 'itemview'がレンダリングされるコレクションビューに関連付けられたモデルのコレクションをレンダリングします。キャッシュされたビューはイベントを失う
コレクションがソートされ、新しいオーダーに基づいてリストビューが再レンダリングされたとき、私は各アイテムの全く新しいビューを作成していました。そのモデルに関連付けられたビューの以前のインスタンスをクリアしていないため、私はゾンビが残っていると信じています。
だから、最初にレンダリングする機能は、第3 /秒など時間と呼ばれた時はいつでも
render : function() {
$(this.el).empty();
var content = this.template.tmpl({});
$(this.el).html(content);
sortingView.el ='#sorting-container';
var els = [];
_.each(this.collection.models, function(model){
var view = new TB_BB.RequestItemView({model : model});
els.push(view.render().el);
});
$('#request-list').append(els);
sortingView.render();
return this;
}
だから、私はTB_BB.RequestItemView(したがってゾンビ)までクリアしていなかった...私はどうしたら私のコレクションをレンダリング
これを解決するために、コレクションビューに単純なキャッシングを追加しようとしました。新しいアイテムビューを作成する代わりに、すでに作成されている場合は代わりに使用します。ビューが再利用されているように私のコード
initialize : function(){
_.bindAll(this,"render");
this.collection.bind("add", this.render);
this.collection.bind("remove", this.render);
this.template = $("#request-list-template");
this.views = {};
},
events : {
"change #sort" : "changesort",
"click #add-offer" : "addoffer",
"click #alert-button" : "addalert"
},
render : function() {
$(this.el).empty();
outerthis = this;
var content = this.template.tmpl({});
$(this.el).html(content);
sortingView.el ='#sorting-container';
var els = [];
_.each(this.collection.models, function(model){
var view;
if(outerthis.views[model.get('id')]) {
view = outerthis.views[model.get('id')];
} else {
view = new TB_BB.RequestItemView({model : model});
outerthis.views[model.get('id')] = view;
}
});
$('#request-list').append(els);
sortingView.render();
return this;
}
は、これはそれほどで動作します - しかし、私が気づいたことは、私は、キャッシュされたビュー(例えばを使用している場合、コレクションがソートされており、レンダリング機能がキャッシュを見つけることですサブアイテムビューのすべてのイベントが機能しなくなるのはなぜですか?何故ですか?
誰もがこれを行う良い方法を提案することができますか?
ありがとうございます - なぜ彼らは最初の場所でイベントを失うのでしょうか? – Xrender
その要素(RequestItemView.el)が$(this.el).empty()行のdomから削除されているからです。イベントを再接続するのは、delegateEventsメソッドが使用されるものです。 – OlliM