Backbone Custom Events

Question

Предположим, у меня есть два вида (paginationview и postsview) и коллекция (postscollection). Всякий раз, когда нажата кнопка .next в paginationview, я вызываю следующую функцию в postcollection, а post-коллекция извлекает сообщения новой страницы с сервера (код упрощен). Теперь в моем представлении сообщения я хочу отображать сообщения, которые находятся на последней странице. Я не хочу привязывать свое представление к событию «добавить» в коллекции, потому что есть больше случаев, когда что-то добавляется в коллекцию. Я хочу, чтобы моя функция «renderlist» в моем сообщении была вызвана только при вызове функции «nextPage» в моем postcollection. Как связать их с функциями вместе?

// paginationview

var PaginationView = Backbone.View.extend({ 
    events:{ 
     'click a.next' : 'next', 
    }, 

    next: function() { 
     this.collection.nextPage(); 
     return false; 
    } 
}); 

// коллекция

var PostsCollection = Backbone.Collection.extend({ 
    model: model, 

    initialize: function() { 
     _.bindAll(this, 'parse', 'url', 'pageInfo', 'nextPage', 'previousPage'); 
     this.page = 1; 
     this.fetch(); 
    }, 

    parse: function(response) { 
     console.log(response); 
     this.page = response.page; 
     this.perPage = response.perPage; 
     this.total = response.total; 
     this.noofpages =response.noofpages; 
     return response.posts; 
    }, 

    url: function() { 
     return '/tweet/' + '?' + $.param({page: this.page}); 
    }, 

    nextPage: function() { 
     console.log("next page is called"); 
     this.page = this.page + 1; 
     this.fetch(); 
    }, 

// postsview

var PostsView = Backbone.View.extend({ 
    events:{ 
     'click #testbutton' : 'test', 
     'click #allbutton' : 'render', 
    }, 

    initialize: function() { 
     this.listenTo(this.collection, 'add', this.addOne); 
    }, 

    render: function() { 
     $(".maincontainer").html(""); 
     this.collection.forEach(this.addOne, this); 
     return this; 
    }, 

    renderlist: function(){ 
     $(".maincontainer").html(""); 
     this.collection.forEach(this.addOne, this); 
    }, 

    addOne: function(post) { 
     var post = new postView({model : post}); 
     post.render(); 
     this.$el.prepend(post.el); 
    }, 
}); 

Answer 1

Вы можете использовать свои собственные события для этой цели.

В Collection.nextPage вы стреляете событие:

this.trigger('nextpage'); 

и зрения в initiazlie методе вы связываете вашу функцию к этому событию:

this.listenTo(this.collection, 'nextpage', this.renderlist); 

А также не забудьте связать контекст (опять же при инициализации метода просмотра):

_.bindAll(this, 'render', 'rederlist');