且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Flex3学习笔记5

更新时间:2022-08-14 20:43:29

Flex3学习笔记5


Flex3数据绑定

数据绑定是Flex非常棒的特征之一,它给了轻易传递信息的能力。


数据绑定:当数据源对象的数据发生变化时,目标对象的数据会自动更新,而不需要再编写代码去强制更新。


绑定实际也是借助事件机制来完成的,当目标使用了数据绑定的时候,目标对象就会监听数据源对象的某一固定事件。当数据源发生变化时,数据源会派发改变事件(ChangeEvent),通知目标对象更新数据。这个过程由Flex完成,不需手动干预。


绑定的前提条件:源对象的数据和目标对象的数据格式相同。

1、在对象的属性标签中,使用{ }把数据源直接绑定到对象的某个属性上。
如:

  1. mx:TextInput id="helloTextInput" text="Hello, World" />
  2. mx:Label text="{helloTextInput.text}" />

你还可以创建两个字符串变量,并绑定其中一个的值到Label标签上:
  1. mx:String id="firstName">Alaricmx:String>
  2. mx:String id="lastName">Colemx:String>
  3. mx:Label id="nameLabel" text="{firstName}" />

绑定到多个目的标签的情况:
  1. mx:String id="displayName">Jed90210mx:String>
  2. mx:Label id="nameLabel" text="{displayName}" />
  3. mx:Button id="nameButton" label="{displayName}" />

还可以进行字符串的串联,如:
  1. mx:String id="displayName">Jed90210mx:String>
  2. mx:Label text="{'Hello, '+displayName}" />

更为复杂的字符串串联情况:
  1. mx:String id="firstName">Alaricmx:String>
  2. mx:String id="lastName">Colemx:String>
  3. mx:Label text="{'Hello, '+firstName+' '+lastName}" />

还有一种等价的方法,如下:
  1. mx:Label text="Hello, {firstName} {lastName}" />

使用花括号进行计算,如下:
  1. mx:Label text="Eleven times forty-two equals {11*42}" />

或者是:
  1. mx:Label text="Hey {firstName}, eleven times forty-two equals {11*42}" />

2、在对象的属性标签中,使用{ }把某个函数的返回值作为数据源绑定到对象属性上。
函数的参数要使用[Bindable]绑定符号
[Bindable]
[Bindable(event="eventname")]
Event表示当数据源发生变化时,数据源所在对象派发的事件类型,它是可选项,默认的事件名是“propertyChange”,一般情况下只需要使用[Bindable]标签。