我怎么知道我的館藏已經有使用Backbone.JS的數據？

Question

我正在使用javascript框架BACKBONE.JS開發網站。 在我的網站上，有一個“類別選擇”下拉列表。 使用Backbone集合獲取，我成功地將類別下拉列表渲染了。 在標題中，我有三個水平菜單[如下圖所示]。 用戶單擊菜單（使用骨干路由器完成頁面導航）。 我這一天的主要內容將會改變。 用戶可以根據類別過濾內容。 我的類別過濾器下拉選項不會經常更改。

• 全部= http://www.Site1.com
• 手機= http://www.Site1.com/#all/mobile
• 桌面= http://www.Site1.com/#all/desktop

我的路由器：

dealapp.AppRouter = Backbone.Router.extend({
    routes: {
        "": "home",
        "all/mobile": "mobile",
        "all/descktop": "displayAllVoucher"
    },
    home: function () {},
    mobile: function () {},
    desktop: function () {}
});

成功案例

我正在使用“ http://www.Site1.com/ ”加載我的網站。 函數home將獲得呼叫並執行列出的操作。 如果我導航到其他選項卡（移動/桌面），則會顯示我的類別下拉列表。[注意：我正在從home功能中的服務器中獲取我的類別]

腳本

我正在直接使用“ http://www.Site1.com/#all/deal ”加載我的網站。 在這種情況下，我的類別下拉列表沒有呈現，我得到了一個空的下拉列表。 我知道我還沒有在手機和台式機的其他兩個功能中添加類別獲取。 如果我每次都在移動和桌面功能中包括類別獲取，那么我的類別獲取調用將轉到服務器並從服務器獲取數據。

我的疑問

我怎么知道我的收藏中是否已有數據？ 我想重用已經下載的數據。 如果數據在本地存儲中不可用，那么我需要從服務器獲取數據。

Answer 1

您可以覆蓋集合上的提取。 Fetch返回一個延遲的對象，您可以將其存儲在集合本身上。 如果deferred為null，則將調用原型訪存。 這樣做的好處是，在代碼中您總是調用fetch，並且如果集合中有數據，則返回緩存的數據。

fetch : function(options) {
  if(this.deferred){
    return this.deferred;
  }
  this.deferred = Backbone.Collection.prototype.fetch.call(this, options);
  return this.deferred;
}

Answer 2

其他人處理了這個特定的問題，並且可以找到一些插件。

我目前成功使用的是Thorax框架，它在Backbone上增加了一些功能。

對於Model和Collection他們添加了isPopulated()和isEmpty()方法，如其文檔所示 。

他們會告訴您集合中是否有數據。 如果您不想使用整個框架，只需從此處的Git存儲庫復制代碼即可。

簡而言之，它們通過重寫fetch來解決此問題，以在提取數據時將名為_fetched的屬性設置為true。

---

另一種方法是緩存數據。 在大多數情況下，這是個好主意，但這要視情況而定。 在您的方案中，最好將其緩存在localStorage中。

我發現一個似乎可以完成工作的插件是Backbone fetch cache 。

描述：

該插件攔截對提取的調用，並將結果存儲在緩存對象（Backbone.fetchCache._cache）中。 如果在選項中使用{cache：true}調用了fetch並且URL已被緩存，則AJAX調用將被跳過。

---

在此答案中還提到了另一個版本：是否在ribs.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'); 

您將獲得一個示例集合的實例，其中的數據已被提取。 每當您再次需要此集合時，都可以再次調用該方法。 然后，您將獲得完全相同的實例，而無需再次獲取它。