이벤트 버블 링 이상한

Question

이벤트 버블 링에 약간의 이상 함이 있습니다. 이는 어떻게 이것이 정상적으로 작동하는지 이해하지 못한다는 것을 의미합니다.

DataGroup을 확장하는 구성 요소가 있으며 항목 렌더러가 이벤트를 송출 (거품)합니다.

// MyRenderer.mxml 
<s:ItemRenderer> 
    <s:Button click='dispatchEvent(new Event('customEvent',true))' /> 
</s:ItemRenderer> 

데이터 그룹은 이벤트에 대한 수신기를 자체에 추가합니다.

// MyDataGroup.mxml 
<s:DataGroup itemRenderer="MyRenderer" creationComplete='onCreationComplete()'> 
    <fx:Metadata> 
     [Event(name='customEvent',type='flash.events.Event')] 
    </fx:Metadata> 
    <fx:Script> 
     private function onCreationComplete():void 
     { 
      addEventListener('customEvent',onCustomEvent); 
     } 
     private function onCustomEvent(event:Event):void 
     { 
     } 
    </fx:Script> 
</s:DataGroup> 

데이터 그룹의 상위 항목도 이벤트에 대한 수신기를 추가합니다.

// MyComponent.mxml 
<s:Group> 
    <MyDataGroup customEvent='onCustomEventHandler()' /> 
</s:Group> 

나는 MyDataGroup에 등록 된 핸들러가 MyComponent에, 먼저 핸들러를 이벤트를 잡을 것을 예상 한 것입니다.

그러나 역순으로 보겠습니다. 즉, MyComponent에 걸려, MyDataGroup에 걸렸습니다. 잡히면 event.phase == EventPhase.BUBBLING.

여기 무슨 일 이니? 왜 내가이 행동을보고 있습니까?

저는 Flex 4.0을 사용하고 있습니다.

Answer 1

두 이벤트 모두 MyDataGroup 구성 요소의 동일한 인스턴스를 청취하고 있다는 것이 확실합니다. 대신 MyDataGroup의 MyComponent라고하는 이벤트 리스너를 추가하는 경우

, 당신이 예상거야 행동 :

<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300" 
      initialize="group1_initializeHandler(event)"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.events.FlexEvent; 
      public function onCustomEventHandler(event:Event):void{ 
       trace('my Component handler'); 
      } 

      protected function group1_initializeHandler(event:FlexEvent):void 
      { 
       // add the event listener to 'this' 
       this.addEventListener('customEvent',onCustomEventHandler); 
      } 

     ]]> 
    </fx:Script> 
    <martyPitt:MyDataGroup id="dataGroup" /> 
    <!-- The event listener here was listening on the myDataGroup instance, not on the MyComponent instance customEvent="onCustomEventHandler(event)" --> 
</s:Group> 

나는 이벤트 리스너를 의심 - 같은 구성 요소에 있지에도 불구하고 - 기반 발사했다 추가 된 순서대로. 컴파일러 인수 '-keep'을 사용하여 생성 된 ActionScript를 조사하여 구체적으로 파악해야합니다. 귀하의 인라인 리스너 (MyComponent)가 MyDataGroup 생성자에 추가 된 것 같습니다. 다른 리스너는 creationComplete 처리기 인 MyDataGroup에 추가되므로 MyComponent 리스너가 먼저 발생합니다.

Answer 2

참으로 이상한 행동. 당신이 이벤트 리스너 인라인을 추가 사실

, (당신의 예제는 :

<MyDataGroup 
customEvent='onCustomEventHandler()' 
/> 

), 프레임 워크는 캡처 단계에서 이벤트 리스너를 추가합니다. 따라서 부모 핸들러에서 먼저 입력되는 예상되는 동작입니다. 내가 알기로는 EventPhase가 EventPhase.BAPBLE_PHASE와 같지만 EventPhase.CAPTURE_PHASE가 표시되어야합니다.