Блог

Главная - Вопросы по программированию - Метод рендеринга из базового класса вызывается в backbone

Метод рендеринга из базового класса вызывается в backbone

#javascript #backbone.js #backbone-views

#javascript #backbone.js #backbone-представления

Вопрос:

У меня есть представление строки поиска:

 App.Views.SearchField = Backbone.View.extend({
    events: {
        'keyup' : 'setFilter'
    },

    setFilter: function() {
        if (typeof this.filterCallback === 'function') {
            var filter = this.$el.val();
            this.filterCallback(filter);
        }
    },

    setFilterCallback: function(filterCallback) {
        this.filterCallback = filterCallback; //debounce here
    }
});

который создается: 

 App.searchBar = new App.Views.SearchField({
    el: $('[data-role="top-search"]')
});

Я подключаюсь к нему из инициализации другого представления:

 App.Views.PartnerCompanies = App.Views.baseView.extend({

initialize: function( options )
{
    this.filter = '';
    App.searchBar.setFilterCallback(this.updateFilter);
    _.bindAll(this, "updateFilter");
}

render: function() {
console.log('rendering partnercompanies list');
// get data and show it.
}

updateFilter: function(filter) {
    console.log('filter updated');
    this.filter = filter;
    this.render();
},

Но он не работает.

Вывод:

 rendering partnercompanies list 
filter updated [multiple times]

Мой render() метод никогда не вызывается после обновления фильтра.

Проверка в отладчике показывает, что вызывается render() метод Backbone.View базового класса (grandparent class). Я в замешательстве, так как я использовал этот же метод в другом представлении, и он отлично работает.

Редактировать:

это в updateFilter относится к App.searchBar , а не к App.Views.PartnerCompanies экземпляру.

Комментарии:

1. Как вы создаете свой App.Views.PartnerCompanies экземпляр? И если вы console.log(this) используете свой updateFilter() метод, что вы получаете? (Вам придется покопаться в результирующем объекте, чтобы выяснить, что это такое; объекты Backbone не получают приятных очевидных имен при входе в консоль.)

2. добавлено редактирование к исходному вопросу

Ответ №1:

Как вы говорите в своей правке, this in updateFilter() является экземпляром App.searchBar , а не App.Views.PartnerCompanies . В результате, когда вы вызываете this.render() in updateFilters , он вызывается в App.searchBar экземпляре. App.searchBar не имеет render() , как и его родительский элемент App.Views.SearchField . Но App.Views.SearchField наследуется от Backbone.View , что делает. Вот почему ваш метод вызывает метод Backbone render() .

По сути, проблема в том, что this он не ссылается на ваш App.Views.PartnerCompanies . Это должно быть легко исправить. Если вы поменяете местами свою _.bindAll и setFilterCallback строки в своей App.Views.PartnerCompanies , все должно быть готово. Таким образом, вы привязываете свою this переменную перед назначением ее в качестве обратного вызова, поэтому контекст не изменится при ее вызове в updateFilter .