Backbone.js 使用主干并尝试使用Parse.com中的数据填充我的集合

对这里来说是很新的。我试图在不复制和粘贴我遇到的教程中的代码的情况下重新创建ToDo示例。我还使用Parse.com作为我的后端。我一直在尝试使用主干视图填充我的集合中的待办事项。这是我的看法

app.ItemsView = Backbone.View.extend({

    tagName: "section",

    initialize: function() {
        app.items = new app.ItemCollection;
        app.items.query = new Parse.Query(app.Item);
        app.items.fetch();

        console.log(app.items.models.length);

        var itemsInJSON = [];

        app.items.models.forEach(function(item){
            console.log("Item being pushed is " + item);
            itemsInJSON.push(item.toJSON());
        });

        this.render(app.items);
    },

    render: function(items) {
        items.each(this.addItem, this);
        return this;
        // $("#bucketList").html(itemsView.render().el);
    },

    addItem: function(item) {
        var itemView = new app.ItemView ({model: item});
        this.$el.append(itemView.render().el)
    }

});

我已经在Parse.com上检查了我的应用程序，我可以看到我的数据库中保存了2个项目。我知道有问题，因为当我调用

console.log（app.items.models.length）时在初始化中，我得到的长度为0。但是当我加载页面后直接在Chrome开发工具控制台中键入
app.items.models.length
时，我得到的长度是2

为什么我的initialize没有获取项目来填充我的集合？
因为
获取
实际上执行AJAX请求，所以它是异步的，您必须处理这个事实。它返回的对象如中所述，因此您的代码应该执行以下操作

app.items.fetch().then(function() {
  console.log(app.items.models.length);
  ...
  this.render();
}.bind(this));

这确保了依赖于AJAX请求结果的代码只能在该请求完成后执行

请注意，我使用
.bind（this）
确保在jqXHR promise的回调中，我可以作为
this
访问视图。这只适用于IE9+（请参阅），如果您需要支持IE8或更低版本，请使用下划线。在这种情况下，我建议您不要在promise中使用Jquery。
主干网在此情况下使用事件来管理/帮助

您应该做的第一件事是将模型/集合逻辑（fetch、set、get等）移动到模型/集合内部

然后，您可以在视图中看到类似的内容：

this.lintenTo(app.items, "sync", this.render);

这是处理这些情况的主要方法

但是为什么不使用承诺呢？

当您在视图中执行fetch（）时，您已经破坏了SRP，因为如果将来出于某种原因，您需要更改fetch的调用方式，您需要触摸视图文件，但请记住fetch是一个模型/集合函数，在我看来，这意味着这种观点有不止一个原因需要改变。另外，当您在视图中执行fetch（）并使用promissions时，您需要使用bind（this）来保留范围，在我看来，您可以避免将此代码传递给模型/集合，而只侦听视图中的事件。
对于任何模型/收集函数（fetch、save、destroy、set、get…）也是一样的。
fetch
是异步的-它在
console.log（…）
语句之前没有完成，但在控制台中检查时有。啊，好的。感谢您指出
fetch（）
是一个AJAX请求。现在知道了这一点，我决定通过一个成功选项使用回调函数，就像我对AJAX调用一样。我是否应该将收集逻辑移到我的收集构造函数@rcarvalho中的initialize选项中？不是所有逻辑，但在这种情况下，您只需要获取逻辑。我将在集合（或）模型内创建一个名为“fetchContent”的函数，然后执行fetch（）；我认为您应该进一步说明为什么使用承诺会破坏SRP，我很想听到更多关于它如何使编写单元测试变得更加复杂的信息。谢谢。我知道你从哪里来，但我不一定同意。有时视图中发生的某些事情会触发对服务器请求的需求，在这种情况下，我认为视图触发获取是可以的。我认为一个笼统的声明是错误的，但我同意在老年退休金计划用例中，这是一个很好的建议。不过，我在为使用承诺的代码编写测试时从未遇到过任何问题；）