ExtJS/Javascript에서 이벤트를 처리하는 가장 좋은 방법

Question

ExtJs/Javascript에서 응용 프로그램을 빌드하려고하는데 이벤트를 통해 이벤트를 알리면 구성 요소를 서로 독립적으로 유지할 수 있습니다. 그러나 이벤트를 발생시키고 캡처하는 방법은 발신자와 수신자에게 좀 더 구체적입니다.

더 좋은 방법이 있습니까? 어떤 컴포넌트가 하나의 이벤트를 발생시킬 수 있고 또 하나의 컴포넌트는 그것을 듣기 위해 등록 할 수있는 하나의 중심 EventBus 클래스를 작성할 계획입니다.

이미 이와 같은 작업을 수행 할 수있는 라이브러리가 있습니까? 나는 백본을 보았다. 나는 그것이 무엇을하고 있는지 똑같은 일을하는지 확신하지 못한다. 이미 그들이 events 또는 actions라고하든 (A publisher/subscriber 또는 observer 모델을 사용하여 이벤트 위임을 수행하는 프레임 워크를 가지고있는 경우 Mediator는, 죽은 간단 쓰기

Answer 1

또는 시스템 emitter이든에게 전화).

당신은 그냥 Mediator에 대한 액세스 Mediator 유일한 emitter/publisher/등, 다음 줄, 모듈/클래스/서비스/등을합니다. 당신이 원하는 경우 자신의 사건처럼 보일 것입니다/모듈 당신의 "클래스"에 대한 공개 방법을 가질 수 있도록

var myEvents = Mediator(), 

Module1 = (function (events) { 
    var private_data = {}, 
     private_method = function() {}, 
     public_interface = { init : init }; 

    function init() { // setup procedures 
     events.listen("widget/process/request", function (data) { 
      var result = doStuff(data); 
      events.fire("widget/process/result", result); 
     }); 
    } 
}(myEvents)), 

Module2 = (function (events) { 
    var private_data = {}, 
     public_interface = { init : init }; 

    function init (data) { // setup procedures 
     events.fire("widget/process/request", data); 
     events.listen("widget/process/result", private_method); 
    } 

    return public_interface; 
}(myEvents)); 


Module1.init(); 
Module2.init(data); 

은, 당신도, 당신의 중재자를 포장, 수업의 내부에 뭔가를 할 수 하지만 중재자로를 통해 데이터를 전달됩니다

var myClass = function() { 
    var mediator = null, 
     public_interface = { 
     fire : function (evt, data) { if (!mediator) { return; } mediator.fire(evt, data); }, 
     listen : function (evt, handler) { if (!mediator) { return; } mediator.listen(evt, handler); }, 
     setMediator : function (newMediator) { mediator = newMediator; } 
    } 
}; 

var mediator = Mediator(), 
    obj1 = myClass(), 
    obj2 = myClass(); 

obj1.setMediator(mediator); 
obj2.setMediator(mediator); 

obj1.listen("event1", obj1.doStuff.bind(obj1)); 
obj2.fire("event1", obj2.data); 

귀하의 모듈을 이제 모두 하나의 중재자에 액세스 할 수 또는 그러나 많은 매개 당신 ... 당신은 각각 자신의 중재자를 위젯 줄 수있는 선택하는 개별 구성 요소가 공유 할 수있는 것 ... ... 또한 각 위젯에 시스템 전체 조정자에 대한 액세스 권한을 부여하므로 구성 요소가 AJAX 또는 DOM과 같은 글로벌 서비스에 액세스 할 수 없지만 widget 할 수있다.

공용 랩퍼 호출을 사용하여 구성 요소에 인터페이스를 제공하여 람다/콜백 헤비 JS 방식이 아닌 기본 프로세스에서보다 고전적인 방식으로 프로그래밍 할 수 있습니다 (

).

var imageLoader = ImageLoader(); 
imageLoader.setMediator(mediator); 
img = imageLoader.load("myimg037"); 
imageLoader.fire("imageloader/imageloaded/myimg037", img); 

또는 이와 유사한 프로젝트에서 보일 수 있지만 - imageLoader 다른 모듈에 대해 아무것도 모르지만 당신은 그것의 .fire 메서드를 호출 할 때, 어떤 모듈 같은 중재자를 공유하고 이벤트를 수신 통지됩니다.

Answer 2

osf Sakalos, Saki라고하는 MsgBus 플러그인을 확인하십시오.

http://examples.extjs.eu/?ex=msgbus

그것은 ExtJS에 구성 요소 사이를 통과하는 메시지에 대한 게시/가입 모델을 제공합니다.

Answer 3

이 기능은 이미 extjs4.x의 컨트롤러를 통해 구현됩니다. 컨트롤러는 이벤트를 듣고 그에 따라 행동하는 중심적인 장소입니다. 또한 모든 구성 요소에는 컨트롤러에서 다시들을 수있는 사용자 정의 이벤트를 발생시키는 fireEvent 메소드가 있습니다.더 많은 정보를 위해 문서를 참조하십시오 :이 티켓 가까이 표시했다

http://docs.sencha.com/ext-js/4-1/#!/guide/application_architecture

및

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.app.Controller