[Bindable]:元数据标签,它在代码中的作用就是向编译器提供如何编译程序的信息。它的最大作用是使程序组件间的数据同步变得容易。在开发中通常用上Bindable作用在视图控件上,如给它绑定一个对象,则以后只需要在逻辑层更改这个对象的值,则视图层的控件数据会自动更新(同步),而不再需要手动去更新视图。
现在来探索一下Bindable的工作原理:
先来实现一个简单的绑定例子:
<mx:Script>
<![CDATA[
[Bindable]
private var bind_String:String="hi";
private function onChange():void
{
bind_String = "hello";
}
]]>
</mx:Script>
<mx:Text text="{bind_String}">
<mx:Button click="onChange()">
单击按钮则改变了text的文字,这个就是bindable。那么它是怎样工作的呢?以下是flex编译器处理后的代码:
[Bindable(event="propertyChange")]
private var bind_String:String="hi";
private function onChange():void
{
var oldValue:String = bind_String;
bind_String = "hello";
if(bind_String!==oldValue) {
this.dispatchEvent(PropertyChangeEvent.createUpdateEvent(this,
"bind_String", oldValue, bind_String));
}
}
由上面可以看到数据源更改的时候抛出了一个PropertyChangeEvent事件,通知事件侦听器该数据源发生了变化,并更新视图。
“这也说明了,绑定不过是事件游戏而已,flex为用户隐藏了很多底层算法。”这句概括说明了Bindable的原理。
分享到:
相关推荐
本文主要讲解AngularJS ng-non-bindable 指令,这里帮大家整理了ng-non-bindable指令的基本知识资料,有需要的小伙伴可以参考下
什么是元数据(metadata):[Bindable]大概又是Flex用得最多的元数据了。
第2章 Flex企业应用开发基础 2.1 MXML语言 2.1.1 用MXML表示ActionScript对象 2.1.2 查看由MXML文件所翻译的ActionScript代码 2.1.3 IMXMLObject接口 2.2 客户端保持状态 2.3 客户端MVC 2.4 ...
本书对Flex的基础知识着墨不多,所有内容都围绕Flex+Java这一企业级应用开发技术展开,侧重于对Flex技术原理、企业级应用的架构思想和实现方法的讲解,所以书中的内容不会随着Flex版本的升级而过时。 第1章 Flex...
第2章 Flex企业应用开发基础 2.1 MXML语言 2.1.1 用MXML表示ActionScript对象 2.1.2 查看由MXML文件所翻译的ActionScript代码 2.1.3 IMXMLObject接口 2.2 客户端保持状态 2.3 客户端MVC 2.4 ...
Bindable.js 实现了灵活、快速的双向数据绑定的 JavaScript 库。 Two-way data binding means linking properties of two separate objects - when one changes, the other will automatically update with that ...
{idx:2, names: "test2", sex: "g" } ]; public function doSelect(o:Object):void { Alert.show("行的数据分别是:"+o.idx+"/"+o.names+"/"+o.sex); } private var sheet:Sheet; private ...
[Bindable] private var slides:ArrayCollection private function resultHandler(event:ResultEvent):void { slides = event.result.album.slide; } private function faultHandler...
安装npm install --save bindable-component用法import { BindableComponent } from 'bindable-component' ;// Aternatively// import { BaseComponent } from 'bindable-component';class MyComponent extends ...
可绑定 Bindable是一个设计系统,旨在在工具中提供视频产品,以构建紧密一致的界面。 Bindable将为设计者和工程师提供一种通用的模式。 Bindable是作为插件开发的,并使用构建。...npm install @bindable-ui/bindable
open flash chart 2 的swc文件包 可以在flex里面调用了. [Bindable] private var chart:String='{ "elements": [ { "type": "bar","alpha":0.8,...http://teethgrinder.co.uk/open-flash-chart-2/json-format.php
var BindableObject = require ( "bindable-object" ) ; var person = new BindableObject ( { name : "craig" , last : "condon" , location : { city : "San Francisco" } } ) ; person . bind ( "location....
[Bindable] var result:String; function sendRequest(){ var name=name1.text; var password=password1.text; ro.validateLogin(name,password); ro.addEventListener(ResultEvent.RESULT,results); } function ...
算是flex初学者的的笔记吧,首先可以概览一下下文中的代码,然后我们主要是看看[Bindable]的这种用法。
<?xml version="1.0" encoding="utf-8"?> *" creationComplete="initTree();... change="iFrame.source=tree.selectedNode.path" ... // TODO: add some links here to Flex sites } ]]> </mx:Application>
based) JDBC drivers with JNDI-bindable DataSources, including DataSources that implement Connection and Statement Pooling, as described by the jdbc3 spec and jdbc2 std extension.
VIDE is a lightweight dialogue system and interface designed to be bindable to any UI system. You are in control of the dialogues you create. Key features: - Add sprites, audios, text, tags, and ...
s Deviations from standard Modula-2 s Modula-2 type and range checks s The scope operators :: and . s GDB and Modula-2 s Chill s How modes are displayed s Locations and their accesses s Values and ...