Backbone.js：检查数据是否准备好以及数据集是否为空的优雅方式

Question

我正在为两件事寻找更好的解决方案：

• 我如何理解数据是否已获取并准备好，我使用BasicDealList.on("reset", function(){})了解数据是否从 ajax 获取并解析并准备好使用但感觉很脏。

• 如果一个空的 JSON 来自诸如{}之类的获取，它仍然显示 BasicDealList.length 为 1 而它应该为 0 因此我被迫通过collection.length == 1 && jQuery.isEmptyObject(BasicDealList.toJSON()[0] ) 检查第一个元素是否为空collection.length == 1 && jQuery.isEmptyObject(BasicDealList.toJSON()[0]这非常丑陋。

这是代码：

BasicDeal = Backbone.Model.extend();    
BasicDealCollection = Backbone.Collection.extend({
    model: BasicDeal,
    url: '/some/ajax/url/',
});
BasicDealList = new BasicDealCollection();

BasicDealList.on("reset", function(collection, response){
    isEmpty = collection.length == 1 && jQuery.isEmptyObject(BasicDealList.toJSON()[0]);
    if (isEmpty){
    // render no deal found html
    }
    else{ 
    // render list of deals
    }
}
BasicDealList.fetch();

Answer 1

如果您不喜欢监听reset ，您可以将回调直接传递给.fetch() ：

BasicDealList.fetch({
    success: function(collection, response){
        // ...
    }
});

如果稍后在你的应用程序中，你想知道你是否已经获取了数据，你通常可以只检查BasicDealList.length 。 如果您想避免重复请求服务器上实际上为空的 collections，您可能需要制定一个自定义解决方案，例如在.fetch()上设置一个标志：

BasicDealList.fetch({
    success: function(collection, response){
        BasicDealList.fetched = true;
        // ...
    }
});

至于空数据问题，您应该从服务器返回[]而不是{} 。 Backbone 的 Collection 在.reset()中调用this.add(models, ...) ，而.add()检查models参数是否为数组； 如果不是，则将其包装在一个中：

models = _.isArray(models) ? models.slice() : [models];

因此传递{}将导致models设置为[{}] ，这不是您想要的。 如果您无法控制服务器，您可以在自定义.parse()方法中检查{} ，如果找到则返回[] 。

Answer 2

我知道这个问题已经得到回答，但这里有一个替代方案。

BasicDealCollection = Backbone.Collection.extend({
    model: BasicDeal,
    url: '/some/ajax/url/',
});

myCollection = new BasicDealCollection()
deferred = myCollection.fetch()

$.when(deferred).then(function() {
  // do stuff when we have the data.
});

这样做的主要好处是我们正在使用“何时”function。“何时”function 使我们能够检查多个获取调用并成功执行一次。

$.when(deferredOne, deferredTwo, deferredThree).then(function() {
  // do stuff when we have the data.
});

此外，如果我们将延迟的 object 存储到一个变量中，我们可以这样做。 该变量将是一个标志，让我们知道我们已经加载了数据。

if (deferred.state() === "resolved") {
    // do stuff when we have the data.
}

当我们在集合上调用 fetch() 时，它返回一个 jQuery deferred object。一个 jQuery deferred object 可以处于 3 种状态，“pending”、“rejected”或“resolved”，一旦我们有了数据，它将设置 88274437 of 401188推迟 object 解决。

Answer 3

我们需要一种方法来判断 RelationalModel 的关系是否已被获取。 这是我们的解决方案（在 Coffeescript 中）。

initialize: (objects, options) ->
  @fetched = false
  @listenTo @, 'sync', -> @fetched = true