0

我this.collection.each()用来遍历从后端获取的集合。

问题：我注意到，当我将reset集合的事件绑定到render方法中的视图的initialize方法并将 a console.log()within放置this.collection.each时，我看到了预期的控制台输出。

但是，如果我不进行上述绑定，而只是使用this.render()within initialize，console.log()则不会输出任何内容。这对我来说似乎很奇怪，有人可以提供解释吗？

console.log(this.collection);我还在循环之前放置了一个，这总是正确输出集合！我猜想在视图初始化时没有填充集合，但这将导致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
    });
}
4

2 回答 2

1

当你初始化你的视图时，this.similarPhotoList是一个空集合。因此，当您创建您的 时similarPhotoListView，您将其传递给一个空集合。similarPhotoListView.initialize因此使用空集合调用render，所有这些都在集合被填充之前fetch。

第一种方法起作用的原因是因为reset在collection.fetch. 从骨干源：

fetch:
...
    options.success = function(resp, status, xhr) {
            collection[options.add ? 'add' : 'reset'](collection.parse(resp, xhr), options);
            if (success) success(collection, resp);
          };
...
于 2012-07-10T14:21:19.947 回答
0

initialize在实例化时运行，因此render您甚至在传递集合之前运行。此外，render不应直接从initialize

于 2012-07-10T14:25:17.093 回答