BackboneJS:将更多项目加载到集合中

wil*_*age 8 javascript model-view-controller mongodb backbone.js

在Backbone JS中,当我获取一个集合时,我应该获取整个集合还是其中的一小部分?

例如,我在mongoDB中有新闻源集合,可能有1000个项目.当用户点击页面时,我只想向他们显示最新的10个项目,并选择"加载更多".但如果他们通过URL访问特定项目,http://site.com/#/feed/:itemID我希望能够提取该项目的记录.

1.我最初应该提取多少文件?

2.我如何通过id获取任何项目?

wil*_*age 13

{add: true}在我的集合上调用fetch时最终使用了该语句.这可以防止集合被fetch的结果替换,而是将结果附加到集合中.然后我还使用了'跳过'数量{data: {skip: amountOfItemsInCollectionAlready },这在服务器端用于从数据库中获取正确的批次项目.

我的最终获取方法如下所示:

    loadMore: function(e){

        this.collection.fetch({
            add: true,// this adds to collection instead of replacing
            data:{// this is optional params to be sent with request
                skip: this.collection.length// skip the number of items already in the collection
            }
        });
    }
Run Code Online (Sandbox Code Playgroud)

  • 只需注意Backbone 0.9.10用户:fetch()不再接受`add:true`选项.但是你可以使用`{update:true,remove:false}`来实现相同的功能 (20认同)

nra*_*itz 5

你可能不想只使用Collection.fetch(),因为你不会得到客户端缓存的好处 - 它会删除你已经从服务器加载的项目并重置集合.您可能需要Backbone.Collection使用自定义函数进行扩展以检索更多项目.我在最近的一个项目中使用了以下代码:

Backbone.Collection.extend({

    // fetch list without overwriting existing objects (copied from fetch())
    fetchNew: function(options) {
        options = options || {};
        var collection = this,
            success = options.success;
        options.success = function(resp, status, xhr) {
            _(collection.parse(resp, xhr)).each(function(item) {
                if (!collection.get(item.id)) {
                    collection.add(item, {silent:true});
                }
            });
            if (!options.silent) collection.trigger('reset', collection, options);
            if (success) success(collection, resp);
        };
        return (this.sync || Backbone.sync).call(this, 'read', this, options);
    }

});
Run Code Online (Sandbox Code Playgroud)

这主要是从默认fetch()代码中复制的,但不是删除现有项目,而是添加新项目.您可能希望在服务器端实现某些功能,使用建议的options对象Julien传递要加载的项目的参数,可能是页码(如果要控制服务器上的页面大小)或启动-stop pair(如果你想在客户端控制它).


Jul*_*ien 3

1 - 您应该获取 10 个

将页面参数添加到您的集合中,并让后端代码返回匹配的页面(10/页)。/my_objects?page=2 获取记录 10-20 等。

你这样做(未经测试):

collection.fetch({data: {page:2}})
Run Code Online (Sandbox Code Playgroud)

或者直接修改网址

2 - 要按 ID 获取项目,您创建模型

object = new Model({id: 1})
Run Code Online (Sandbox Code Playgroud)

并获取它

object.fetch()
Run Code Online (Sandbox Code Playgroud)