Flex 4 bug:inherited propery cause transition bug - apache-flex

Question

i try to make some foldable groups, like an accordion component
i create a Base.as class and extends from Group,code like this
package
{
import flash.events.MouseEvent;
import spark.components.Group;
public class Base extends Group
{
public var header:Group;
public var body:Group;
public function Base()
{
super();
}
override protected function initializationComplete():void
{
super.initializationComplete();
if(header)
{
header.addEventListener(MouseEvent.CLICK,changeState);
}
}
protected function changeState(event:MouseEvent):void
{
if(currentState=="fold")
currentState="unfold";
else
currentState="fold";
}
}
}
and i defined two properties,header and body here,but i don't instantiate here,and then i worte a mxml component "FoldUnit.mxml" that extends "Base" and i will instantiate header and body in it,code like this
<?xml version="1.0" encoding="utf-8"?>
<local:Base xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" currentState="fold" clipAndEnableScrolling="true"
xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:local="*" width="200" >
<local:states>
<s:State name="fold" />
<s:State name="unfold" />
</local:states>
<local:transitions>
<s:Transition toState="fold">
<s:Sequence>
<s:Resize target="{this}" duration="400" />
<s:RemoveAction target="{body}" />
</s:Sequence>
</s:Transition>
<s:Transition toState="unfold">
<s:Resize target="{this}" duration="400" />
</s:Transition>
</local:transitions>
<s:Group id="header" width="100%">
<s:Rect height="40" width="100%">
<s:fill>
<s:SolidColor color="0xff0000" />
</s:fill>
</s:Rect>
</s:Group>
<s:Group id="body" includeIn="unfold" y="40" width="100%">
<s:Rect height="200" width="100%">
<s:fill>
<s:SolidColor color="0x00ff00" />
</s:fill>
</s:Rect>
</s:Group>
</local:Base>
after all,i placed three of FoldUnit in main application to simulate an accordion component.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:local="*">
<s:Group>
<s:layout>
<s:VerticalLayout variableRowHeight="true" />
</s:layout>
<local:FoldUnit />
<local:FoldUnit />
<local:FoldUnit />
</s:Group>
</s:Application>
everything like fine,however,if i try to click one red header to fold up,that green body just disappear immediately,looks like that RemoveAction tag is useless.
so,as i try to figure out why,i made things simple first,and i combine that function in Base.as into FoldUnit.mxml,then it works fine.
so,i wonder is there a bug or something?
PS:i don't wanna use a skinable component,coz' the size measure process always delayed,it's hard to location the scroll position in scroll bar.