4

我正在尝试使用主干填充 instagram 图像,

我基本上有3个模型如下,

用户模型存储与 instagram 相关的所有用户信息

App.Models.User = Backbone.Model.extend({
    defaults: {
        id: '',
        access_token: '',
        userid: '',
        username: '',
        full_name: '',
        profile_picture: ''
    },
    urlRoot: "/api/user/",
    initurl: function() {
        return "https://api.instagram.com/v1/users/"+this.get('userid')+"/media/recent/?access_token=" + this.get('access_token');
    },
    initialize: function() {
        this.set('id', $('#domdump .id').val());
        this.fetch({
            success: function(model) {
                var photos = new App.Collections.Ig_photos([],{
                    url: model.initurl()
                });
            }
        });
    }

});

存储下一个 url 以进行分页的模型

App.Models.Ig_next_url = Backbone.Model.extend({
    defaults: {
        next_url: ''
    },
    next_url:function(){
        return this.get('next_url');
    }
});

照片的模型

App.Models.Ig_photo = Backbone.Model.extend({});

多张照片的集合

App.Collections.Ig_photos = Backbone.Collection.extend({
    model: App.Models.Ig_photo,
    initialize: function(model, options) {
        this.url = options.url;
        this.nextSet();
    },
    sync: sync_jsonp,
    parse: function( response ) {
        if(response.pagination && response.pagination.next_url && response.pagination.next_url != this.url){
            var next_url = new App.Models.Ig_next_url({ next_url: response.pagination.next_url });
            this.url = next_url.next_url();
        }
        return response.data;
    },
    nextSet: function(){
        this.fetch({
            success: function(photos){
                var ig_photos_views = new App.Views.Ig_photos_view({ collection: photos});
                console.log(photos);
            }
        });
    }
});

此外,我有一些视图使用调用集合的下一组的加载更多按钮进行渲染。

我试图实现的是在 nextset() 时将照片附加到集合中,并且集合会使用以前的数据 + 新数据进行更新,但现在它被覆盖了。

也可以从 modelfetch 实例化新集合吗?

4

1 回答 1

8

您不需要创建新视图。相反,您应该听在集合上触发的“添加”事件并相应地呈现新项目。

nextSet: function(){
    this.fetch({add : true}); // The add option appends to the collection
}

此选项在非常好的文档中有详细说明。

于 2012-12-06T22:48:50.243 回答