기본 이벤트를 Marionette의 Marionette.View 기본 유형에 추가하려면 어떻게해야합니까?

Question

저는 현재 이라는 방법으로 Marionette의베이스 Marionette.View을 확장하고 있습니다. 나는이 날보기 당을 재정의 할 필요없이 내가 만드는 모든보기에서이 메소드를 호출 할 수 있습니다

(function() { 

    define([ 
     'backbone.marionette' 
    ], 

    function(Marionette){ 

     return _.extend(Backbone.Marionette.View.prototype, { 

      quickClick: function(e) { 
       $(e.target).get(0).click(); 
      } 

     }); 

    }); 

}).call(this); 

/view.js

설정/꼭두각시에이 일을하고 있습니다. 큰!

여기 자리에 객체 여전히 이벤트와 아래로 손질 뷰의 :

(function() { 

    define([ 
     'backbone.marionette', 
     'app', 
     'templates' 
    ], 
    function(Marionette, App, templates){ 

     // Define our Sub Module under App 
     var List = App.module("SomeApp"); 

     List.Lessons = Backbone.Marionette.ItemView.extend({ 

      events: { 
       'tap .section-container p.title':   'quickClick' 
      } 

     }); 

     // Return the module 
     return List; 

    }); 

}).call(this); 

당신이 궁금해 경우, tap이 모바일 앱이기 때문에 내가 Hammer.js에서 사용하고 이벤트입니다. 따라서 iOS 및 Android에서 300ms의 클릭 이벤트 지연을 우회하기 위해 tap 이벤트가 특정 요소에서 발생하면 click 이벤트가 수동으로 트리거됩니다.

이제 모든 작업이 정상적으로 작동하고 있으며 이에 대한 자세한 설명이 필요하다는 느낌이 들었습니다. 그래야 대답이 상황에 따라 제공 될 수 있습니다.

제 문제는 events 개체를 정의해야합니다. 위의 요소와 같은 요소에 대해서는 전혀 신경 쓰지 않습니다. .section-container p.title. 그러나, 모든보기 내에서 에 대한 탭 이벤트를 모두<a> 개의 태그로 등록하고 싶습니다. 내가 모든보기에이를 추가, 난 그냥 이벤트가 설정/네트 /보기에 이의를 추가 할 생각 대신

events: { 
    'tap .section-container p.title':   'quickClick', 
    // I don't want to add this to every single view manually 
    'tap a': 'quickClick' 
} 

를 작성하는 각보기에서이 이벤트를 정의 유지하기 위해 이해가되지 않습니다. js 파일에서 Marionette.View 프로토 타입에 메소드를 추가했습니다.

는 여기가 작동하지 않습니다 물론

(function() { 

    define([ 
     'backbone.marionette' 
    ], 

    function(Marionette){ 

     return _.extend(Backbone.Marionette.View.prototype, { 

      events: { 
       'tap a': 'quickClick' 
      }, 

      quickClick: function(e) { 
       $(e.target).get(0).click(); 
      } 

     }); 

    }); 

}).call(this); 

을, 무슨 짓을했는지. 이벤트 오브젝트는 해당 뷰에만 적용되는 이벤트를 추가해야 할 때마다 대체됩니다. Btw, tap a 내보기 자체 이벤트 개체가없는 경우 작동합니다.

내 질문은 : 어떻게 기본 이벤트를 Marionette의 Marionette.View 기본 유형에 추가합니까?

Answer 1

"물론 작동하지 않습니다. 해당 뷰에만 적용되는 이벤트를 추가해야 할 때마다 이벤트 개체가 무시됩니다."

예, 문제 인 것 같습니다. 다음은 이벤트 위임을 수행 마리오네트의 일부는 다음과 같습니다

// internal method to delegate DOM events and triggers 
_delegateDOMEvents: function(events){ 
    events = events || this.events; 
    if (_.isFunction(events)){ events = events.call(this); } 

    var combinedEvents = {}; 
    var triggers = this.configureTriggers(); 
    _.extend(combinedEvents, events, triggers); 

    Backbone.View.prototype.delegateEvents.call(this, combinedEvents); 
    }, 

한 가지 가능한 솔루션은 마리오네트이 (민간!) 부분을 덮어 쓸 수 있습니다 -하지만 아마 마리오네트의 새로운 버전에서 변경 될 수 있고 항상있는 것 것들이 여전히 작동하는지 확인하십시오. 그래서 이것은 나쁘다.

하지만 하위보기에서 이와 비슷한 작업을 수행 할 수 있습니다.:

events: _.extend(this.prototype.events, { 
    'tap .section-container p.title': 'quickClick' 
}) 

'글로벌'이벤트가 하나만 맞는 경우 다른 질문입니다.

또는 해당

events: _.extend({'tap a': 'quickClick'}, this.my_fancy_events) 

처럼 무언가를 추상보기 클래스를 정의하고 또한 quickClick 방법을 정의하고 모든 당신 파단이보기를 사용할 수 있습니다. 그런 다음 '이벤트'가 아닌 'my_fancy_events'에서 이벤트를 정의합니다.

Answer 2

보기를 확장 할 때 상황에 따라 '초기화'에서 추가 호출을 추가하고 '이벤트'속성을 확장하여 새로운 호출을 추가해야 할 때가 있습니다.

inheritInit: function(args) { 
    this.constructor.__super__.initialize.apply(this, args); 
    this.events = _.extend(this.constructor.__super__.events, this.eventsafter); 
}, 

그런 다음, 확장 된 관점에서, 나는

initialize: function(options) { 
    this.inheritInit(arguments) 
    //..some extra declarations... 
} 

를 호출 할 수 있으며, 또한 내가 정기적 방식으로 '이벤트'속성을 사용할 수 있습니다 : 내 추상보기 나는 기능을 가지고있다.