如何过滤服务器上的Backbone集合

是否有一种常见模式，可以使用Backbone和过滤服务器上集合的服务？鉴于生产中的骨干应用程序的数量，我一直无法在Google和Stack Overflow搜索中找到任何内容，这令人惊讶。如何过滤服务器上的Backbone集合

假设我正在为使用Backbone的堆栈溢出构建一个新的前端。

在搜索屏幕上，我需要将以下信息传递给服务器并获取值得的结果页面。

过滤条件
排序标准每页
结果
页码

骨干似乎并不在卸载过滤向服务器的兴趣。它期望服务器返回整个问题列表并在客户端执行过滤。

我猜为了做这项工作，我需要继承Collection的子类并覆盖fetch方法，以便不是总是从同一个REST式URL获取数据，而是传递上述参数。

我不想重新发明轮子。我是否遗漏了Backbone中的一项功能，可以使此过程更简单或与现有组件更兼容？是否已经有一套完善的模式来解决这个问题？

来源

2014-09-10 Patrick McElhaney

如果您只是想在请求上传递GET参数，您应该可以在获取调用本身中指定它们。

collection.fetch({ 
    data: { 
    sortDir: "ASC", 
    totalResults: 100 
    } 
});

选项传递到取应直接翻译为jQuery.ajax通话和数据属性应该自动获得解析。当然，重写fetch方法也很好，特别是如果你想标准化部分逻辑。

来源

2014-09-10 14:02:05 stakolee

有没有办法像这样传递数据，而不是在获取调用内部进行？我记得之前在集合中定义了像这样的过滤字段，但不记得我是如何做到的。谢谢！ – 2015-08-18 08:20:45

你是对的，创建你自己的Collection是一条路，因为除了OData以外没有关于服务器分页的标准。

不是重写'fetch'，我通常在这些情况下做的是创建一个collection.url属性作为函数，根据集合状态返回适当的URL。

但是，为了进行分页，服务器必须返回项目总数，以便根据每页X个项目计算出多少页面。现在一些API正在使用诸如HAL或HATEOAS这些基本上是HTTP响应头的东西。为了获取这些信息，我通常会在sync事件中添加一个侦听器，该事件在任何AJAX操作后都会引发。如果您需要通知可用项目/页数的外部组件（通常为视图），请使用事件。

简单示例：您的服务器在响应头中返回X-ItemTotalCount，并且期望请求查询字符串中的参数page和items。我们使用其他自有财产

var PagedCollection = Backbone.Collection.extend({ 
    initialize: function(models,options){ 
    this.listenTo(this, "sync", this._parseHeaders); 
    this.currentPage = 0; 
    this.pageSize = 10; 
    this.itemCount = 0; 
    }, 
    url: function() { 
    return this.baseUrl + "?page=" + this.currentPage + "&items=" + this.pageSize; 
    }, 
    _parseHeaders: function(collection,response){ 
    var totalItems = response.xhr.getResponseHeader("X-ItemTotalCount"); 
    if(totalItems){ 
     this.itemCount = parseInt(totalItems); 
     //trigger an event with arguments (collection, totalItems) 
     this.trigger("pages:itemcount", this, this.itemCount); 
    } 
    } 
}); 

var PostCollection = PagedCollection.extend({ 
    baseUrl: "/posts" 
});

通知，baseUrl简化扩展PagedCollection。如果需要添加自己的initialize，调用父的原型，一个这样的，否则将无法解析标题：

PagedCollection.protoype.initialize.apply(this,arguments)

您甚至可以添加fetchNext和fetchPrevious方法收集，在那里你只需修改this.currentPage和fetch。请记住，如果您要将一个页面替换为另一个页面而不是追加，请将{reset:true}添加为fetch选项。

现在，如果项目的后端是一致的，那么允许在服务器上分页的任何资源都可以使用客户端上的一个基于PagedCollection的集合来表示，因为使用了相同的参数/响应。

来源

2014-09-11 11:14:28 CharlieBrown

如何过滤服务器上的Backbone集合

回答

相关问题