this.collection.each不會以此方式觸發（backbone.js）

Question

我正在使用this.collection.each()來遍歷從后端獲取的集合。

問題：我注意到，當我將集合的reset事件綁定到initialize方法中視圖的render方法，並將console.log()放置在this.collection.each ，我看到的控制台輸出是預期的。

但是，如果我不執行上述綁定，而只是在initialize使用this.render() ， console.log()不輸出任何內容。 這對我來說真的很奇怪，任何人都可以提供解釋嗎？

我還放置了console.log(this.collection); 就在循環之前，它總是正確地輸出集合！ 我猜測View初始化時尚未填充該集合，但這會導致console.log(this.collection); 不顯示任何東西。

這個作品

SimilarPhotoListView = Backbone.View.extend({
    el: '#modal_similar_items',

    initialize: function() {
        this.collection.on('reset', this.render, this);
    },

    render: function() {
        console.log(this.collection);
        this.collection.each(function(photo, index) {
            console.log('hello');
        }, this);
        return this;
    }
});

這不是從this.collection.each（）中輸出的

SimilarPhotoListView = Backbone.View.extend({
    el: '#modal_similar_items',

    initialize: function() {
        this.render();
    },

    render: function() {
        console.log(this.collection);
        this.collection.each(function(photo, index) {
            console.log('hello');
        }, this);
        return this;
    }
});

這兩個類都通過以下方式實例化：

renderSimilarPosts: function() {
    this.similarPhotoList = new SimilarPhotoCollection();
    this.similarPhotoListView = new SimilarPhotoListView({ collection: this.similarPhotoList });
    this.similarPhotoList.fetch({
        data: {post_id: this.model.id},
        processData: true
    });
}

Answer 1

初始化視圖時， this.similarPhotoList是一個空集合。 因此，當您創建similarPhotoListView ，會similarPhotoListView傳遞一個空集合。 因此， similarPhotoListView.initialize調用render使用一個空集合進行render ，而所有操作均由fetch填充。

第一種方法起作用的原因是因為在collection.fetch觸發了reset 。 從骨干來源：

fetch:
...
    options.success = function(resp, status, xhr) {
            collection[options.add ? 'add' : 'reset'](collection.parse(resp, xhr), options);
            if (success) success(collection, resp);
          };
...

Answer 2

initialize在實例化上運行，因此在傳遞集合之前就運行了render 。 此外，不應直接從initialize調用render