我在事件冒泡中看到一些奇怪的事情,这表明我真的不明白这是如何起作用的。
我有一个扩展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。
答案 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。