Flex数据绑定陷阱(一)

简介:

Flex数据绑定陷阱:常见的误用和错误

当构建Flex或者Adobe AIR程序时,将一个对象的值自动的传递给另一个对象这种处理是数据绑定最常 用并最有用的特征之一。

尽管如此,同时数据绑定会减缓程序的初始化,并且当开发者不是完全理解数据绑定的机制是如何工作的话,会引 起一些开发者意想不到的问题。

最好的解决方法及是确保你正确的使用了它并且在只有需要它的时候才使用它。在这篇文章中,我整理了十条开发者在构建应用使用数据绑定时常见的陷阱和错误。



第一条:

难以发现的无声错误



这有些绑定操作似乎已经工作,但是你最后却沮丧的发现没有并且无从下手修改的例子。



在绑定表达式或者在绑定框架里调用绑定方法时抛出的异常和错误,只会默默的捕 获。因此你将在Flash Player调试版本中看不到任何运行时错误。不仅绑定没有工作,

而且没有任何错误显示。为什么这些错误被无声捕获?



代码实现绑定机制,在绑定发生前需要几个先决条件。绑定 机制会吞噬掉任何错误以防止在运行时抛出运行时异常。

如果你不希望在你的程序中看到这些可能出现的意外错误,这是一个很好的事情。



思考下下面的简单绑定例子:

 



  1. <?xml version="1.0" encoding="utf-8"?>

  1. <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

  1.    xmlns:s="library://ns.adobe.com/flex/spark"

  1.    xmlns:mx="library://ns.adobe.com/flex/mx"

  1.    minWidth="1024" minHeight="768"                                    

  1.    preinitialize="handlePreinitialize()">                        

  1.  

  1.    <fx:Script>

  1.       <![CDATA[

  1.          [Bindable]

  1.          private var xml:XML=

  1.          <users>

  1.             <user>

  1.                <name>EladElrom</name>

  1.                <address>1 Wall Street</address>

  1.             </user>

  1.          </users>;   

  1.                               

  1.          protected function handlePreinitialize():void

  1.          {

  1.             xml = null;

  1.             //BindingManager.debugBinding("label.text");

  1.          }

  1.       ]]>

  1.    </fx:Script>

  1.                         

  1.    <s:Label id="label" text="{xml.user.name}"/>

  1.  

  1. </s:Application>



复制代码
 

我已经添加了xml变量绑定到Label组件。这些代码会运行的很好;但是,我在组件预初始化时 将xml变量设置为null。

这个事件将在组件初始化序列开始之前被派发,此时Label 组件还没有被设置。这个xml变量被设置为null,因此没有name属性在xml对象上。

如果你运行这个程序,你会发现绑定没有发生也没有提示任何错误。



调试绑定



虽然错误被无声的捕获,你仍然有办法可以找出是怎么回事。

使用BindingManager.as和Binding.as来进行调试并不容易,因为如果你没有下载完整的Flex sdk的话,绑定类是没有的。



相反,你可以设置一个断点并跟踪相关的绑定对象来找出问题所在。在这种情况下,你会发现xml对象的值被设置为null,这就是为什么绑定为什么失败的原 因(看图1)。

 

1

图1. xml对象的值被设置为null

 





另一种方法更加直观,是使用BindingManager类的debugBinding方法。

你设置你想观察的组件和属性,然后你就可以看到被捕获的错误。



在上面的示例代码中,我给下面的这行代码加了注释:

 



  1. BindingManager.debugBinding("label.text");



复制代码
 

把这行的注释去掉并在debug模式下运行它;你将 在控制台看到绑定错误(见图2)

 

12

图2.控制台输出的绑定错误

 





看一下Binding.as和BindingManager.as类的代码。代码中含有许多的try...catch表达式来确保形成有效绑定的条件。

以下有一些在绑定时可能抛出的错误类型:



    * Error #1006: Call attempted on an object that is not a function. 

    * Error #1009: Null has no properties.        

    * Error #1010: Undefined has no properties.        

    * Error #1055: Has no properties.

    * Error #1069: Property - not found on - and there is no default value

        

    *错误#1006:试图调用的对象不是函数。

    *错误#1009:空没有属性。

    *错误#1010:未定义没有属性。

    *错误#1055:没有属性。

    *错误#1069:属性 - 找不到 - 并且没有默认值



如果任何这些错误发生,绑定对象将默默捕获他们并不再实现绑定。

你可以使用绑定管理的调试选项来看到这些错误。

绑定管理除了捕获这些错误之外还捕获其他的错误。

 

本文来自:http://blog.csdn.net/gongyongxing/archive/2010/08/10/5801472.aspx

本文转自jiahuafu博客园博客,原文链接http://www.cnblogs.com/jiahuafu/p/4303909.html如需转载请自行联系原作者


jiahuafu

相关文章
|
开发者 容器
ArkUI框架,Flex布局,基础组件及封装,父子组件的双向绑定
Flex组件用于创建弹性布局,开发者可以通过Flex的接口创建容器组件,进而对容器内的其他元素进行弹性布局,例如:使三个元素在容器内水平居中,垂直等间隔分散。 例如:如下的布局代码分别表示:(垂直排列,水平居中,垂直居中)
330 0
ArkUI框架,Flex布局,基础组件及封装,父子组件的双向绑定
|
2月前
|
前端开发 容器
|
3月前
|
前端开发 容器
Flex布局的三个属性要深刻理解!
Flex布局的三个属性要深刻理解!
|
22天前
|
前端开发
【零基础入门前端系列】—怪异盒模型和display属性(十九)
【零基础入门前端系列】—怪异盒模型和display属性(十九)
|
前端开发 容器
CSS - Flex 之最直观的方式学习 Flexbox 属性(二)
CSS - Flex 之最直观的方式学习 Flexbox 属性(二)
115 0
CSS - Flex 之最直观的方式学习 Flexbox 属性(二)
|
Web App开发 前端开发 算法
CSS - Flex 之最直观的方式学习 Flexbox 属性(一)
CSS - Flex 之最直观的方式学习 Flexbox 属性(一)
122 1
CSS - Flex 之最直观的方式学习 Flexbox 属性(一)
|
前端开发 容器
CSS - Flex 之最直观的方式学习 Flexbox 属性(四)
CSS - Flex 之最直观的方式学习 Flexbox 属性(四)
118 0
CSS - Flex 之最直观的方式学习 Flexbox 属性(四)
CSS - Flex 之最直观的方式学习 Flexbox 属性(三)
CSS - Flex 之最直观的方式学习 Flexbox 属性(三)
85 0
CSS - Flex 之最直观的方式学习 Flexbox 属性(三)
flex布局及常用属性,学flex收藏这个就够用了,超详细分析“建议收藏”
flex布局及常用属性,学flex收藏这个就够用了,超详细分析“建议收藏”
114 0
|
前端开发 C#
【WPF】MVVM动态修改Bingding的另一种思路——用Style样式
原文:【WPF】MVVM动态修改Bingding的另一种思路——用Style样式 问题场景: 界面上有个ListBox控件,它的内容Item绑定了一个列表,即 ItemsSource =”{Binding StudentList}”。
1494 0