2012-10-29 45 views
14

骨幹木偶,你可以做的觸發器和事件極其相似的東西:骨幹中的觸發器和事件有什麼區別?

觸發:

return Marionette.Layout.extend({ 
    triggers: { 
     'click .something': 'view:handleClickSomething' 
    }, 

    initialize: function(){ 
     this.bindTo(this, 'view:handleClickSomething', this.handleClickSomething); 
    }, 

    handleClickSomething: function(){} 
} 

與事件:

return Marionette.Layout.extend({ 
    events: { 
     'click .something': 'view:handleClickSomething' 
    }, 

    handleClickSomething: function(ev){} 
} 

事件的方式似乎是一個更快更簡單的方法並且還可以更容易地獲取實際事件本身(因爲它是自動傳入的)。是否有理由相互使用一個?他們的預期用例是什麼?難以找到關於這個在線的很多信息(除了試圖注意註釋源)...

(我只是剛剛發現的事件方法,直到現在一直使用觸發器的一切,因爲我認爲這是隻有這樣)

回答

15

你的第一個例子是觸發器使用不好。觸發器是從視圖中觸發事件的快捷方式,因此外部對象可以捕獲事件,而不是觸發事件的視圖。

http://lostechies.com/derickbailey/2012/05/15/workflow-in-backbone-apps-triggering-view-events-from-dom-events/

+3

這似乎並不像實際回答問題那樣,例如「觸發器是___,而事件是___」。我很清楚觸發器觸發事件​​,事件也是如此,所以這個答案沒有說明任何事情。 – meetalexjohnson

4

如果我們認爲無論是eventstriggers作爲JavaScript對象,那麼這裏的區別是:

事件例如:

events: { 
    'click hi': 'alertTitle', 
}, 

alertTitle: function() { 
    alert('Title!!'); 
} 

在每個事件的關鍵('click h1' )總是一個DOM事件和一個jQuery選擇器,值('alertTitle')總是th e視圖中存在的回調函數的名稱。

觸發例子:

triggers: { 
    'click h1': 'alert:title' 
}, 

在每個觸發器,關鍵仍然是一個DOM事件和jQuery選擇,但價值('alert:title')是你想要一個新的事件的始終名稱引起。該事件處理程序可以在任何地方定義,不一定在當前視圖內。

  1. 您希望您的DOM事件,火災,而不是調用回調函數木偶事件;:當

    觸發器是有幫助

  2. 您希望您的Marionette事件處理程序位於當前視圖之外的某個位置,例如其父視圖。在這種情況下,該視圖的父級可以使用onChildviewAlertTitle()函數來處理此alert:title事件。
+1

我認識到,'alert:title'觸發器總是觸發'onAlertTitle'方法(在前綴上大寫和添加')。這意味着,「觸發器」不僅會將事件暴露給父視圖,還會嘗試執行自己的視圖。 和相反的方式 - 'events:{'click hi':'alert:title'}' - 會做同樣的事情。 – iegik