事件冒泡怪异

时间:2011-01-12 17:40:19

标签: flex

我在事件冒泡中看到一些奇怪的事情,这表明我真的不明白这是如何起作用的。

我有一个扩展DataGroup的组件,它的项目渲染器调度一个事件(冒泡)。

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

DataGroup将事件的侦听器添加到自身。

// 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>

数据组的Parent也为事件添加了一个监听器。

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

我原本预计在MyDataGroup中注册的处理程序应首先捕获事件,然后是MyComponent中的处理程序。

但是,我看到相反的情况 - 即。{,MyComponent,然后是MyDataGroup。被抓住时,event.phase == EventPhase.BUBBLING

这里发生了什么?为什么我会看到这种行为?

我正在使用Flex 4.0。

2 个答案:

答案 0 :(得分:2)

我很确定问题是你的两个事件监听器都在MyDataGroup组件上监听同一个实例。

如果您将事件侦听器添加到MyComponent而不是MyDataGroup,您将获得预期的行为:

<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构造函数中添加的。由于另一个侦听器在MyDataGroup中添加了一个creationComplete处理程序,因此MyComponent侦听器首先触发。

答案 1 :(得分:0)

确实存在奇怪的行为。

实际上,当你内联添加一个事件监听器时(在你的例子中:

  <MyDataGroup
 customEvent='onCustomEventHandler()'
 />

),框架在捕获阶段添加一个事件监听器。所以这是它首先进入父处理程序的预期行为。我不明白的是eventPhase等于EventPhase.BUBBLE_PHASE,尽管它应该显示EventPhase.CAPTURE_PHASE。