Flex4 数据绑定简单示例

最新推荐文章于 2021-05-26 07:22:35 发布

PrinceTerence

最新推荐文章于 2021-05-26 07:22:35 发布

阅读量1.2k

点赞数

分类专栏： Flex4

本文链接：https://blog.csdn.net/PrinceTerence/article/details/23848981

版权

Flex4 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

数据绑定是Flex中比较独特的功能，强大并且易用。数据绑定分为单向数据绑定和双向数据绑定。

示例：使用两个文本输入框相互复制对方内容，使用一个Lable显示文本输入框中的字符串长度。

一、单向数据绑定

<?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">
  <s:layout>
    <s:VerticalLayout paddingLeft="5" paddingTop="5"/>
  </s:layout>
  <s:TextInput id="textInputA" text="{textInputB.text}"/>
  <s:TextInput id="textInputB" text="{textInputA.text}"/>     <s:Label text="输入字符长度: {textInputA.text.length}"/></s:Application>


1、使用{}语法进行数据绑定；
2、输入testInputA的时候能与拎一个同步，并且能同步显示输入字符串长度。



二、双向数据绑定
<?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">
  <s:layout>
    <s:VerticalLayout paddingLeft="5" paddingTop="5"/>
  </s:layout>
  <s:TextInput id="textInputA" text="@{textInputB.text}"/>
  <s:TextInput id="textInputB"/>
  <s:Label text="输入字符长度: {textInputA.text.length}"/>
</s:Application>


1、功能效果同单向数据绑定例子。
2、此处语法变为“@{}”。