我正在使用javascript框架BACKBONE.JS开发一个网站。在我的网站中,有一个类别选择下拉列表。使用Backbone集合提取,我已成功下载我的类别下拉列表。在我的标题中,我有三个水平菜单[图片如下所示]。用户单击菜单(使用骨干路由器完成页面导航)。我当天的主要内容将发生变化。用户可以根据类别过滤内容。我的类别过滤器下拉选项不会经常更改。
我的路由器:
dealapp.AppRouter = Backbone.Router.extend({
routes: {
"": "home",
"all/mobile": "mobile",
"all/descktop": "displayAllVoucher"
},
home: function () {},
mobile: function () {},
desktop: function () {}
});
我正在加载我的网站使用" http://www.Site1.com/"。功能主页将接到一个电话并执行列出的操作。如果我导航到其他选项卡(移动/桌面),我的类别下拉显示。[注意:我从家庭功能中的服务器获取我的类别]
方案
我正在使用" http://www.Site1.com/#all/deal"加载我的网站直。在这种情况下,我的类别下拉列表没有渲染,我得到一个空的下拉列表。我知道我还没有在移动设备和桌面设备的其他两个功能中添加我的类别提取功能。如果我每次都在移动和桌面功能中包含类别提取,那么我的类别提取呼叫将转到服务器并从服务器获取数据。
我怀疑
我如何知道我的收藏品是否已有数据?我想重用已下载的数据。如果本地存储中没有数据,那么我需要从服务器获取它。
答案 0 :(得分:0)
您可以覆盖集合上的提取。 Fetch返回一个延迟对象,您可以将其存储在集合本身上。如果deferred为null,您将调用原型fetch。优点是在代码中总是调用fetch,如果集合有数据,则返回缓存数据。
fetch : function(options) {
if(this.deferred){
return this.deferred;
}
this.deferred = Backbone.Collection.prototype.fetch.call(this, options);
return this.deferred;
}
答案 1 :(得分:0)
其他人处理了这个具体问题,可以找到一些插件。
我目前正在成功使用的是Thorax框架,它在Backbone上添加了一些东西。
对于Model
和Collection
,他们添加了isPopulated()
和isEmpty()
方法here in their documentation。
他们会告诉您集合中是否有数据。如果您不想使用整个框架,只需从Git repository here复制代码即可。
简而言之,他们通过覆盖fetch
来解决问题,以便在获取数据时将名为_fetched
的属性设置为true。
另一种方法是缓存数据。大多数时候这是一个好主意,但这取决于。在您的场景中,将其缓存在localStorage中可能是个好主意。
我发现一个插件似乎是Backbone fetch cache。
说明
此插件拦截调用fetch并将结果存储在a中 缓存对象(Backbone.fetchCache._cache)。如果使用{调用fetch 选项中的cache:true}并且URL已经被缓存了 将跳过AJAX调用。
本回答中提到了另一个版本:Caching collections in backbone.js?
正如那里的回答者所说,你可以这样做:
var manager = (function(){
var constructors = {
'example': ExampleCollection
};
var collections = {};
return {
getCollection: function(name) {
if(!collections[name]) {
var collection = new constructors[name]();
collection.fetch();
collections[name] = collection;
}
return collections[name];
}
}
})();
这里经理负责实例化馆藏和 取出它们。当你打电话:
var exampleCollection = manager.getCollection('example');
您将获得一个包含数据的示例集合实例 牵强。每当你再次需要这个系列时,你可以打电话给 方法再次。然后,您将获得完全相同的实例而不需要 再次取回它。