2013-02-15 84 views
0

我有一个自定义事件触发集合的bbone视图上的用户交互,我希望它表示另一个不相关视图上的更改。为此,我使用自定义事件。骨干自定义事件绑定和自定义甚至触发器的最佳位置

//a global event object for my pub-sub model 
var vent = Backbone.extend({}, Backbone.Event); 

var C1 = Backbone.Collection.extend(); 
var V1 = Backbone.View.extend(
    events: { 
    'click .appointment': 'clickCallback' 
    }, 

    clickCallback: function(){ 
    vent.trigger('appointment:selected', apptProps); 
    } 
); 

var c1Obj = new C1([{...}, {...}]); 
var v1Obj = new V1({ 
    collection: c1Obj 
}); 

所以,当用户点击集合视图v1Obj的.appointment元素,这将宣布任命:选定的事件。

现在我想要一个不同的视图V2来响应这个事件。哪里会是绑定“预约:选定”事件的最佳场所?在视图V2(CASE 1)的initialize()中还是在V2(CASE 2)的集合/模型的initialize()中或其他位置? 我想澄清什么是最佳实践,如果有的话。

CASE 1:

var V2 = Backbone.View.extend(
    initialize: function(){ 
    vent.on('appointment:selected', this.apptSelected, this); 
    }, 
    appSelected: function(apptProps){ 
    ... 
    } 
); 

CASE 2:

var C2 = Backbone.Collection.extend(
    initialize: function(){ 
    vent.on('appointment:selected', this.apptSelected, this); 
    }, 
    appSelected: function(apptProps){ 
    ... 
    } 
); 

据我明白,Bbone的用户互动时的理念,是处理数据,而不是修改的标记,该理念是数据会逐渐改变观点。如果是这样,对原始问题的答案是CASE 2?

+0

你可以考虑类似[this](http://stackoverflow.com/a/10471303/834178)。然后,您的视图可以侦听模型更改事件,如'this.listenTo([model/collection],'change:selected',this.apptSelected)'。 – 2013-02-15 15:55:11

回答

1

我认为最地道的事情将是:

  • 被列入代表的集合
  • 当用户点击.appointment中的“选择”的状态,厂景增加了预约模式向selectedAppointments集合
  • 视图2结合的selectedAppointments和正常收集生命周期事件(添加,删除,重设)重新呈现自身相应地他们的选择argum
  • 这两种观点都借此收集耳鼻喉科initialize

只是一个侧面说明,作为骨干的0.9.9本身可以作为一个应用广泛的事件总线,而不是你的vent对象Backbone对象。