[Flex]ItemRendererにおけるTarget、及びCurrentTargetの仕様について

DataGridのItemRendererにButtonを設置したところ、VBox上に配置した場合と、

直接配置した場合のclickイベントのtarget、及びCurrentTargetが異なる結果となっています。
VBox上に配置した場合は、自分自身の「Button」がtargetとなるのですが、
直接配置した場合は、「・・・_inlineComponent2」がtargetになってしまいます。
詳細は、下記のサンプルをご参照ください。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreationComplete()">
  <mx:Script>
  <![CDATA[
    import mx.controls.Alert;

    private var tmpArr:Array = [{col1:"", col2:"", col3:"aaa"}, {col1:"", col2:"", col3:"bbb"}];

    private function onCreationComplete():void{
      dg.dataProvider = tmpArr;
    }

    public function btnOnClickHandler(event:MouseEvent):void{
      Alert.show("Target:" + event.target.className.toString() + "\nCurrentTarget:" + event.currentTarget.className.toString());
    }
  ]]>
  </mx:Script>

  <mx:DataGrid x="32" y="23" id="dg" width="568">
    <mx:columns>
      <mx:DataGridColumn width="100" headerText="VBox有" dataField="col1" sortable="false" >
        <mx:itemRenderer>
        <mx:Component>
          <mx:VBox horizontalAlign="center">
            <mx:Button label="VBox有" click="outerDocument.btnOnClickHandler(event)" height="20">
            </mx:Button>
          </mx:VBox>
        </mx:Component>
      </mx:itemRenderer>
    </mx:DataGridColumn>
    <mx:DataGridColumn width="100" headerText="VBox無" dataField="col2" sortable="false" >
      <mx:itemRenderer>
        <mx:Component>
          <mx:Button label="VBox無" click="outerDocument.btnOnClickHandler(event)" height="20">
          </mx:Button>
        </mx:Component>
       </mx:itemRenderer>
      </mx:DataGridColumn>
      <mx:DataGridColumn headerText="項目名" dataField="col3" />
    </mx:columns>
  </mx:DataGrid>
</mx:Application>

この件について、Adobeに問い合わせたところ、下記の回答が返ってきました。

【Adobeの回答】
ItemRendererにおけるTarget、及びCurrentTargetの決定方法は、
コンポーネントのルートタグであるかどうかによって決定いたします。
コンポーネントのルートタグである場合は、今回のサンプルで確認されましたように
"_inlineComponent2"のように表示されます。
コンポーネントにid="xxx"プロパティを追加して、
「コンポーネントのルートタグで id 属性を指定することはできません。」
のコンパイルエラーが出るかでないかで確認することができます。

このような場合に、どのオブジェクトがイベントを発生させたかを確認する方法
といたしましては(統一させる方法)、
VBoxで統一する、もしくは例えばautomationName等のプロパティを使うなどがご
ざいます。

//参考例ここから

  <mx:Button label="VBox無" height="20" automationName="Button"
             click="outerDocument.btnOnClickHandler(event)">
     Alert.show("Target:" + event.target.automationName +
               "\nCurrentTarget:" + event.currentTarget.automationName);

//ここまで


Target、及びCurrentTargetを扱う際のご参考に!!

このブログについて

このブログは吉祥寺にあるブレインチャイルド株式会社の社員で投稿しています。
業務ではまってしまったことや発見したこと。
自分達で新たに学習してみようと思って勉強し始めたことなどを綴っています。
こんな社員が働いているブレインチャイルドに興味がわいててきたなら、是非お問い合わせください。
会社案内
求人案内
先輩のコメント