javascript - 覆盖骨干网中的 fetch 方法

Question

我想覆盖模型和集合中的 fetch 方法，以便在没有网络连接时从本地存储中获取数据。

这是集合内的 fetch 函数

fetch:function(){
   if(online){
      return Backbone.Collection.prototype.fetch.call(this) ;
   }else{
    // return Backbone.Collection.fetch event - with data from localstorage 
   }
}

我在这里面临两个问题

a.success 和 error 函数没有被执行

this.collection.fetch({
   success: function(data){ ... },
   error: function(){ ... }
});

湾。如果没有连接如何将数据设置为集合，以便我可以在成功功能中访问它

Answer 1

尝试这样的事情。$.ajax 返回一个承诺，因此您应该能够执行以下操作

fetch:function(){
   var dfd = new jQuery.Deferred();
   if(this.online){
      return Backbone.Collection.prototype.fetch.call(this) ;
   }else{
     // Do your logic for localstorage here
     dfd.resolve();
   }

   return dfd.promise();
}

然后你可以使用你上面的例子或者我喜欢

this.collection.fetch().then(function() { 
    console.log('Successfully fetched from localstorage or server.'); 
});

Answer 2

经过研究，我找到了问题a的答案。

fetch:function(options){
    if(navigator.onLine){
        return Backbone.Collection.prototype.fetch.apply(this, options) ;
    }else{
     return //Trying to findout
    }
}

在将选项参数传递给 fetch 函数并将参数传递给 fetch.apply 之后，我们将能够从调用函数访问成功函数

Answer 3

覆盖 Backbone 的 sync() 方法以涵盖保存和编辑可能是最有意义的。如果您使用的是由主干.localStorage.js 提供的本地存储，您的覆盖可能如下所示：

Backbone.sync = function(method, model, options, error) {
    if(navigator.onLine){ // Or, however you determine online-ness
        return Backbone.ajaxSync.apply(this, [method, model, options, error]);
    }
    return Backbone.localSync.apply(this, [method, model, options, error]);        
}

我没有尝试过，但希望你能明白。不要忘记在模型和集合上定义 localStorage 属性。