バックボーンコレクション

Question

私は7つのコレクションの合計数を表示する必要があるページがあります。 コレクションに新しいアイテムが作成された場合、更新されたカウントがページに表示されます。すべてのコレクションのカウントが（たとえば1000）巨大であれば、その後renderメソッドは、多くの時間が（となるように、合計7つのコレクションがあると呼ばなっているされて

this.listenTo(XyzCollection, 'update', function() { 
    self.lengthVariable = XyzCollection.length; 
    self.render(); 
}); 

この方法の問題点を次のように私が試しましたと呼ばれる）。

私も

this.listenTo(XyzCollection, 'update', function() { 
    self.lengthVariable = XyzCollection.length; 
    //self.render(); 
}); 

すなわち、ちょうど変数を更新しますが、ページdose'ntがリフレッシュ取得し、私は0としてカウントを参照して、テンプレートに（私はレンダリングコメント）を試してみました。次のように

ある

の例では、初期化シナリオを達成し、ビューをレンダリングするための適切な方法を提案してください：

initialize: function() { 
    xxx1Collection.refresh(); 
    xxx2Collection.refresh(); 
    xxx3Collection.refresh(); 
    xxx4Collection.refresh(); 
    xxx5Collection.refresh(); 
    xxx6Collection.refresh(); 
    xxx7Collection.refresh(); 

    var self = this; 

    this.listenTo(xxx1Collection, 'update', function() { 
     self.var1 = xxx1Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx2Collection, 'update', function() { 
     self.var2 = xxx2Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx3Collection, 'update', function() { 
     self.var3 = xxx3Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx4Collection, 'update', function() { 
     self.var4 = xxx4Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx5Collection, 'update', function() { 
     self.var5 = xxx5Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx6Collection, 'update', function() { 
     self.var6 = xxx6Collection.length; 
     self.render(); 
    }); 

    this.listenTo(xxx7Collection, 'update', function() { 
     self.var7 = xxx4Collection.length; 
     self.render(); 
    }); 
}, 

render: function() { 
    this.$el.html(this.template({ 
     count1: self.var1, 
     count2: self.var2, 
     count3: self.var3, 
     count4: self.var4, 
     count5: self.var5, 
     count6: self.var6, 
     count7: self.var7, 
    })); 

}

Answer 1

を7つのコレクションのための十分な理由がありますと仮定すると、インクリメンタルな名前がビューに存在する場合、コレクションの更新時に再レンダリングする最も簡単な方法は次のとおりです。 Catalog of Eventsから

initialize: function() { 
    // make collections properties of the view 
    this.xxx1Collection.refresh(); 
    this.xxx2Collection.refresh(); 
    /* ... */ 
    this.xxx7Collection.refresh(); 

    // create the event hash once, and reuse it. 
    var events = { update: this.render }; 

    // there's no need to use `self` when using `this.listenTo` 
    this.listenTo(this.xxx1Collection, events) 
     .listenTo(this.xxx2Collection, events) 
     /* ... */ 
     .listenTo(this.xxx7Collection, events); 
}, 

render: function() { 
    // just pass the length here instead. 
    this.$el.html(this.template({ 
     count1: this.xxx1Collection.length, 
     count2: this.xxx2Collection.length, 
     /* ... */ 
     count7: this.xxx7Collection.length, 
    })); 
} 

：

"更新"(collection, options) - モデルのいずれか 数がコレクションから追加または削除された後、単一のイベントが発生しました。