Привязка данных - это декларативное определение способа отображения данных в пользовательском интерфейсе.Под капотом все немного сложнее, поскольку для поддержки функций связывания данных требуется больше, чем просто перехват addEventListener
.
На самом деле это очень мощная функция, и чтобы понять ее подробнее, мы можем взглянуть на простое приложение "Hello World":
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:HGroup>
<s:TextInput id="input" />
<s:Label text="Hello {input.text}" />
</s:HGroup>
</s:Application>
Теперь скомпилируйте это приложение с помощью --keep
отметьте компилятор и посмотрите новую папку «bin-debug / generate».Мы заинтересованы в HelloWorld-generated.as
Вот где эта привязка определяется и вызывается из конструктора:
private function _HelloWorld_bindingsSetup():Array
{
var result:Array = [];
result[0] = new mx.binding.Binding(this,
function():String
{
var result:* = "Hello " + (input.text);
return (result == undefined ? null : String(result));
},
null,
"_HelloWorld_Label1.text"
);
return result;
}
Чуть позже, в конструкторе HelloWorld вы получаете вызовчтобы настроить наблюдателей:
_watcherSetupUtil.setup(this,
function(propertyName:String):* { return target[propertyName]; },
function(propertyName:String):* { return HelloWorld[propertyName]; },
bindings,
watchers);
Что на самом деле просто делает это:
watchers[0] = new mx.binding.PropertyWatcher("input",
{ propertyChange: true },
[ bindings[0] ] ,
propertyGetter );
watchers[1] = new mx.binding.PropertyWatcher("text",
{ change: true,
textChanged: true },
[ bindings[0] ],
null);
Все становится сложнее с двусторонними привязками.