Flex DataBinding用法指导-51CTO.COM

本文和大家重点讨论一下Flex DataBinding的概念，Flex DataBindIng简单的说就是当绑定源属性发生变化时，Flex会把绑定源变化后属性的值赋给目的物的属性，做到了数据同步。

Flex DataBinding详解

[Bindable]作用

Flex DataBindIng简单的说就是当绑定源属性发生变化时，Flex会把绑定源变化后属性的值赋给目的物的属性，做到了数据同步。

◆Flex DataBindIng什么时候发生：

1.在绑定源属性值发生改变时发生。

2.在绑定源发出initialize事件时绑定发生一次。

◆让属性具有可绑定功能：

一般的，只要在属性前加上[Bindable]或[Bindable(event="eventname")]

元标记即可

注意：

如果没有标出触发绑定的事件，正如[Bindable]，Flex会自动为绑定加上propertyChange事件，当源数据发生变化时，Flex将自动派发该事件，触发数据绑定。如果修改后数据和源数据“===”也就是全等，那么Flex将不会触发数据绑定。

如果标出的触发绑定的事件，正如[Bindable(event="eventname")]，那么在源数据发生改变的时候，必须dispatch出该事件才能触发数据绑定。不论修改后数据和源数据是否全等，Flex都将会触发数据绑定，需要自己编程控制，例如：

<mx:Script> 
<!--[CDATA[  
[Bindable(event="hhhh")]  
privatevarss:String="aaa";  
privatefunctiondoTest():void  
{  
ss="bbb";  
f(ss!=="aaa")//判断和源数据是否相等，不相等则触发绑定  
this.dispatchEvent(newEvent("hhhh"));  
}  
]]--> 
</mx:Script> 
<mx:Texttextmx:Texttext="{ss}"/> 
<mx:Buttonclickmx:Buttonclick="doTest()"/>

如果没有this.dispatchEvent(newEvent("hhhh"))这句，那么你点击按钮是没有设么作用的。另外当申明自定义触发事件时，用ChangeWatcher来监控其变化，发现虽然目的源值变了，但是ChangeWatcher却监控不到变化，同样ChangeWatcher也监控不到非共有变量的变化。关于ChangeWatcher，下面会提到。

◆Flex DataBinding绑定函数——Functions,对象——Object,数组——Arrays

函数：

你可以在{}中直接使用函数。例如：<mx:Texttext="{Matn.random()*ss}"/>

上面这个没有什么好讲的，关于函数绑定下面这个比较重要：

<mx:Script> 
<!--[CDATA[  
publicvarss:String="aaa";  
[Bindable(event="hhhh")]  
privatefunctiongg():String  
{  
returnss;  
}  
privatefunctiondoTest():void  
{  
ss=Math.random().toString();  
this.dispatchEvent(newEvent("hhhh"));  
}  
]]--> 
</mx:Script> 
<mx:Texttextmx:Texttext="{gg()}"/> 
<mx:Buttonclickmx:Buttonclick="doTest()"/>

这样给函数加一个[bindable]，便使函数具有Flex DataBinding绑定功能，但是如果不申明自定义触发事件，只能在组件初始化时绑定一次，点击以上按钮是没有什么作用的。大家可以自己试试。

还有getter和setter函数，比较重要，给getter或setter函数加上[bindable]，用不着两个都加，加一个就可以了，例如：

<mx:Script> 
<!--[CDATA[  
publicvarss:String="aaa";  
[Bindable]  
publicfunctiongetgg():String  
{  
returnss;  
}  
publicfunctionsetgg(value:String):void  
{  
ss=value;  
}  
privatefunctiondoTest():void  
{  
gg=Math.random().toString();  
this.dispatchEvent(newEvent("hhhh"));  
}  
]]--> 
</mx:Script> 
<mx:Texttextmx:Texttext="{gg}"/> 
<mx:Buttonclickmx:Buttonclick="doTest()"/>

同样能达到Flex DataBinding绑定效果，如果只有一个getter方法，那么要想实现数据绑定，就需要申明自定义触发事件了，大家可以自己试试。

【编辑推荐】