flex父子页面交互实现（触发事件）

昨天使用了方法回调的方式实现的，今天写了个以手动触发自定义事件，在分派回的事件流中携带交互数据对象的方式实现父子页面交互

首先自定义一个事件,myEvent.as文件

package
{
	import flash.events.Event;

	public class MyEvent extends Event
	{
		public static const CONFIGEDITE:String="configedit";
		public var obj:Object;
		public function MyEvent(type:String,obj:Object)
		{
			this.obj = obj;
			super(type);
		}
		override public function clone():Event { 
			var e:MyEvent = new MyEvent(CONFIGEDITE,obj);
			return e;
		}
	}
}

父页面,test.mxml文件

<?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"
			   >
	<!-- 通过方法赋值的方式回调 -->
	<fx:Script>

		<![CDATA[
			import mx.managers.PopUpManager;
			
			
			[Bindable]
			public var testForm:TestForm = new TestForm; //定义为全局的，这样就只弹一个窗口了
			
			
			public function jump():void{
				//弹出窗口
				PopUpManager.addPopUp(testForm,this,false);
				//添加自定义事件监听,当触发该事件将执行里面的方法
				testForm.addEventListener(MyEvent.CONFIGEDITE,function(e:MyEvent):void{
					showLable.text = e.obj.name;
				});
				//组装父页面要传到子页面的对象
				var obj:Object = new Object;
				obj.name = valueText.text;
				testForm.initPage(obj);
			}
		]]>
	</fx:Script>
	<s:VGroup horizontalAlign="center" verticalAlign="middle" width="80%" height="200">
		<s:Label text="我是父页面，子页面传过来的值为："/>
		<s:Label id = "showLable"/>
		<s:TextInput id="valueText"/>
		<s:Button label="点击将值传递到子页面" click="jump()"/>
	</s:VGroup>
</s:Application>

子页面,TestForm.mxml文件

<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow 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="400" minHeight="200"
			   title="子页面"
			   close="close()"
			   >
	<fx:Script>
		<![CDATA[
			import mx.managers.PopUpManager;
			
			//关闭
			public function close():void{
				PopUpManager.removePopUp(this);
			}
			
			//初始化
			public function initPage(obj:Object):void{ 
				showLabel.text = obj.name; 
			} 

			
			public function goBack():void{
				//组装要传到父页面的对象
				var obj:Object = new Object;
				obj.name = valueText.text;
				//手动触发指定事件
				var myEvent:MyEvent = new MyEvent(MyEvent.CONFIGEDITE,obj);
				//抛出事件
				this.dispatchEvent(myEvent);
			}
		]]>
	</fx:Script>
	<s:VGroup horizontalAlign="center" verticalAlign="middle" width="80%" height="200">
		<s:Label text="我是子页面,父页面传过来的值为："/>
		<s:Label id="showLabel" />
		<s:TextInput id="valueText"/>
		<s:Button label="点击将值传递到父页面" click="goBack()"/>
	</s:VGroup>
</s:TitleWindow>

最后上截图~

这样的方法，如果不用传递数据对象的话，只是需要标识的话，只需要在自定义事件里写不同的事件，然后手动触发不同的事件，根据触发不同的事件执行不同的方法即可。