flex之弹出窗口数据传接

flex之弹出窗口数据传递

弹出窗口：
利用PopUpManager我们可以把flex容器组件作为一种弹出窗口，这样也是便于我们将程序分块编写的方式之一。我们通常会自定义一个容器组件，作为弹出窗口的内容。
举一个例子来说明我们可能利用弹出窗口的地方。

我们做用户信息的增删改查。第一步我们会做一个Module，用于布置datagrid组件和增删查三个按钮，那么在这个Module中我们的datagrid主要就是用于显示查询到的用户数据列表。那么增加按钮事件就是我们弹出一个窗口来编辑数据，完成后在该弹出窗口中点击确定按钮，数据将传送给Module的一个函数。并由这个函数与后台交互，最终使数据通过后台添加到数据库。那么这是弹出窗口向父窗体传递数据的例子，另外我们在Module的datagrid中双击选中的数据，也会弹出窗口，并将该条datagrid的这条记录数据显示在弹出窗口的相应输入框中，供用户编辑。当然这就是父窗体向弹出窗口传递数据的例子了。
在flex中，我所知道的父子窗口传递数据有两种，姑且先让我这么命名并区分它们：一种是事件处理型，另一种就是函数绑定型。
第一种方式（事件处理型）：先看代码，假设我们已经自定义好弹出窗体组件。那么看我们怎么在Module（也就是父窗体）中来调用弹出窗体的。?1protected?function?button1_clickHandler(event:MouseEvent):void{
?2?//这里是新创建一个弹出窗体对象，UserWin为自定义的一个容器组件对象
?3?????????var?win:UserWin?=?new?UserWin();?
?4????var?user:TblBsUserType?=?new?TblBsUserType();
?5//将user对象传递给弹出窗体，其中data为win里头的一个空对象。在win里边的代码是public?data:Object={};
?6????win.data.user?=?user;
?7//通过这种方法给win添加一个事件监听器
?8????win.addEventListener("sendData",onSendData);
?9????????????????PopUpManager.addPopUp(win,this,true);?
10????????????????PopUpManager.centerPopUp(win);
11????????????}
12
13private?function?onSendData(e:Event):void{
14????????????????var?user:UserType?=?e.currentTarget.data.user;
15????????????????Alert.show(ro.toString());
16????????????}如上注释，我们父窗体向子窗体传递数据的时候其实就是像子窗体的一个已存在的对象中动态添加数据属性即可。这一点是ecmascript的规范，也是他的一个很好的优点。
最后那个方法，其实就是我们处理弹出窗口传数据给父窗体的一个处理过程，其实很简单，为了解耦，我们一般不会在弹出窗口中做数据的处理过程，而是直接由弹出窗口传回数据，交给父窗体处理。那么事件分发处理的方式，显而易见就是我们在创建弹出窗体对象的时候，动态的给子窗体注册一个事件监听器，，然后弹出窗体的确定按钮中调用dispatchEvent(new Event("sendData"));即可将数据传回给父窗体中定义的那个事件处理函数去处理。其中e.currentTarget表示当前正在使用某个事件侦听器处理 Event 对象的对象。也就是上边的win对象。
第二种函数绑定型，其实就是很简单，我们知道在ecmascript中函数也是一种变量，那么就可以利用这一点将函数作为一个变量传递给弹出窗体，同样可以达到我们处理的效果，
代码如下：
?1protected?function?button1_clickHandler(event:MouseEvent):void
?2????????????{
?3????????????????var?win:UserWin?=?new?UserWin();?
?4????????????????var?user:TblBsUserType?=?new?TblBsUserType();
?5????????????????win.data.user?=?user;
?6????????????????win.data.send?=?add;
?7????????????????//win.addEventListener("sendData",onSendData);
?8????????????????PopUpManager.addPopUp(win,this,true);?
?9????????????????PopUpManager.centerPopUp(win);
10????????????}
11
12//结果处理函数
13private?function?add(user:TblBsUserType):void{
14????????????????if(null?!=?user.butyId?&&?""?!=?user.butyId){
15????????????????????ro.addUser(user);
16????????????????}
17????????????}

那么在弹出窗体中我们只需要调用data.send(data.user);就可以了。

备注：其实以上两种方法，为了使用方便，其实都还可以优化的地方，比如，事件处理方式，我们还可以在自定义组件中声明事件
<fx:Metadata>
??[Event(name="sendData",type="flash.events.Event")]
?</fx:Metadata>
让使用组件的mxml文档也能显示注册事件，如：<user:UserWin x="115" y="231" sendData=“sendDataHandler(event)”>
?</user:UserWin>

另外，在函数处理方式上，我们是利用函数绑定到对象的方式，来处理数据的，其实，为了使用接口的人更明确一些，我们可以把这个函数预先定义为组件的属性，比如：[Bindale]public?var sendData:Function;这样在创建组件对象的地方，就可以明确的把用户自定义的处理函数赋值给这个属性（sendData）。
总之：不管怎么样，事件处理和函数处理都可以完成我们的要求，任选其一即可。

?

[转]http://www.blogjava.net/samyang/articles/317950.html

查看更多 下一篇