BackboneJs: W widoku jaka jest różnica między el: i tagName:

Question

Próbuję zawrzeć moją głowę wokół tego pojęcia.

Czy możesz mnie o tym zapomnieć i może podać prosty przykład różnicy między atrybutem el: a atrybutem tagName:?

W niektórych przykładach różne widoki używają czasami el:, a inne używają tagName:.

jestem specjalnie aprowizacji z mojego własnego wykonania niniejszej example

Answer 1

Różnica jest taka:

el powinny być używane, aby zachować odniesienie do rzeczywistego węzła DOM reprezentującego widok jako całości.

Oznacza to, że można łatwo wykonywać na nim czynności za pomocą jQuery lub w/e. $ (this.el) .hide() lub $ (this.el) .html ("Jestem teraz obiektem Jquery");

TagName to tylko ciąg, który jest używany do określenia typu węzła DOM, który będzie el. Domyślnie jest to div, ale jeśli chcesz, możesz zrobić z niego dowolny element HTML.

Rozważmy:

var view = Backbone.View.extend({ 
    tagName: 'p', 
    initialize: function() { 
     _.bindAll(this, 'render'); 
    }, 
    render: function() { 
     $(this.el).html('I am a jQuery-ized paragraph'); 
     return this; 
    } 
}); 


$(document.body).append(new view().render().el); 

Problem może być uruchomiony na to, że czasem trzeba ustawić el na instancji z widoku, w którym to przypadku zmienna jest bez znaczenia:

var myView = new view({ el: $("someExistingEl") }); 

Answer 2

var View = Backbone.View.extend({ 
    tagName: 'span', 
    id: 'identity', 
    class: 'classy', 
    el: $(this.tagName), // or 
    el: $('<' + this.tagName + ' />', { 
    id: this.id,  // identity 
    'class': this.class // classy 
    }) // this is jQuery shorthand for building an element fyi 
}); 

var view = new View(); 

Myślę, że to powinno działać dobrze.