2016-03-16 3 views
-1

я собирался через магистральную учебник, и изведать на следующий кусок кода, где преподаватель был извлекая один model из collection и обновления пользовательского интерфейсаBackbone повторно вызывать против JQuery удалить

var PersonsView = Backbone.View.extend({ 
    initialize: function(){ 
     this.model.on('add', this.addPerson, this); 
     this.model.on('remove', this.removePerson, this); 
    }, 
    addPerson: function(person) { 
     var personView = new PersonView({model: person}); 
     this.$el.append(personView.render().$el); 
    }, 
    removePerson: function(person){ 
     this.$('li#' + person.id).remove(); 
    }, 
    render: function() { 
     var self = this; 
     self.model.each(function(record) { 
      var personView = new PersonView({model: record}); 
      self.$el.append(personView.render().$el); 
     }); 
    } 
}); 

В функции

removePerson: function(person){ 
    this.$('li#' + person.id).remove(); 
}, 

Он ищет songId в DOM и удаляет его из пользовательского интерфейса с помощью jQuery.

Вопрос в том, что является более быстрым методом для выполнения этой задачи?

this.$('li#' + person.id).remove(); 

где весь DOM дерево будет анализироваться для поиска элемента и удалить его или

this.$el.html(''); 
this.render(); 

Где вся точка зрения удалена и повторно вынесено

Кстати, я совершенно новой для позвоночника поэтому, пожалуйста, пройдите

+3

Это (как обычно) зависит. Я на самом деле проделаю третий маршрут: найдите соответствующий 'PersonView' и вызовите [' remove'] (http://backbonejs.org/#View-remove). –

+0

Очевидно, что поиск и существующая вещь будут лучше, чем уничтожить все это и воссоздать все это с помощью 1 узла, не так ли? –

+0

Зачем голосовать на этот вопрос? Не могли бы вы сообщить, что не так в этом вопросе? Я просто спрашивал, что является наиболее эффективным и быстрым способом? –

ответ

1

От backbone website

Если JQuery включен на странице, каждый вид имеет $ функцию, которая выполняет запросы контекстных в элементе зрения ... Это эквивалентно запуск:. Вид $ el.find (селектор)

Так the - this.$(...) - селектор только анализирует элемент вида, а не весь DOM. Я бы придерживался первого пути.