Jak używać definicji `Backbone.View.events` do wykrywania niestandardowych zdarzeń z podziałem?

Question

Czy można użyć definicji Backbone.View.events, aby odsłuchać niestandardowe zdarzenia z podziałem?

definicja Dziecko

Wszystkie zdarzenia click są buforowane i wyzwolić mój clicked funkcję:

var Child = Backbone.View.extend({ 
    events : { 
     'click' : 'clicked' 
    }, 
    clicked: function() { 
     alert('View was clicked'); 
     this.trigger("customEvent"); 
    }, 
    render: function() { 
     this.$el.html("<span>Click me</span>"); 
    } 
}); 

definicję Parent

Dlaczego nie customEvent wydarzenia zadzwonić do mojego action funkcję?

var Parent = Backbone.View.extend({ 
    events : { 
     'customEvent' : 'action' 
    }, 
    action : function() { 
     alert('My sub view triggered a custom event'); 
    }, 
    render : function() { 
     var child = new Child(); 
     this.$el.append(child.el); 
     child.render(); 
    } 
}); 

Tworzenie i renderowanie rodzic

var parent = new Parent(); 
parent.$el.appendTo(document.body); 
parent.render(); 

jsfiddle example

wiem, że przydałby listenTo zamiast ale stosując definicję wydarzeń wydaje się być czystsze.

Moim zamiarem jest zbudowanie widoku podrzędnego (np. Selektora kolorów), który wyzwala zdarzenie po zakończeniu.

Answer 1

Szybkie Uwagi: -

• w imprezach przedmiotu myślą, że nie powinniśmy definiować niestandardowe wydarzenia. W przypadku zdarzeń niestandardowych powinniśmy wykonać wiążące. Użyj metody bind() lub sprawdź pewne zdarzenie za pomocą metody on().
• Jeśli element el twojego wydziału znajduje się w el elemie widoku twojego rodzica, możesz bezpośrednio słuchać wydarzeń na elemencie dziecięcym również, pod warunkiem, że nie zwrócisz fałszu z obsługi zdarzeń dziecka. Spójrz na to: Code where parent view is listening event on element onside child view

Jeśli chcesz użyć tylko niestandardowe zdarzenie, można zobaczyć tutaj Your Updated Fiddle

var Child = Backbone.View.extend({ 
    initialize: function(options) { 
     this.parent = options.parent; 
    }, 
    events : { 
     'click' : 'clicked' 
    }, 
    clicked: function() { 
     alert('View was clicked'); 
     this.parent.trigger("customEvent"); 
    }, 
    render: function() { 
     this.$el.html("<span>Click me</span>"); 
    } 
}); 

var Parent = Backbone.View.extend({ 
    initialize: function() { 
     this.on('customEvent', this.action); 
    }, 
    action : function() { 
     alert('My sub view triggered a custom event'); 
    }, 
    render : function() { 
     var child = new Child({parent: this}); 
     this.$el.append(child.el); 
     child.render(); 
    } 
}); 

var parent = new Parent(); 
parent.$el.appendTo(document.body); 
parent.render();