Flex事件机制(一)

Flex事件贯穿我们整个开发,事件分为两类,用户事件和系统事件,比如说我们在页面点击了一个按钮,这是用户触发的事件,当组件初始化完毕,会触发creationComplete事件,这是系统事件。简单的说,用户事件是人触发的,系统事件是flex自身触发的。

       事件的传播分为三个阶段,捕获(Capturing)、定标(Targeting)、冒泡(Bubbling),捕获:为事件监听器检查目标对象之前,应用程序将首先为监听器检查所有这一阶段所注册的父容器和祖先容器,定标:应用程序会为目标对象上的监听器进行检查,冒泡:定标之后,应用程序将为监听器检查所有这一阶段所注册的父容器和祖先容器,冒泡是捕获的相反阶段。这三个阶段中,我们要记住两个对象,target和currentTarget,简单的将,target是引发事件的源对象,currentTarget是监听这个事件的对象。通常来说,target和currentTarget是相同的,比如说我们创建了一个按钮,并在按钮上监听了click事件,但是如果不是在按钮上监听了click事件,而是在它的父容器上监听了这个事件,这时target和currentTarget就不同了。

       说了这些只是我对Flex事件的浅显理解,无论是否做flex开发的朋友看过来都能够对flex开发有一个直观的认识,下面就一个按钮,介绍一下flex中监听事件的四种方式。

       第一种:

<s:Button label="确定" click="Alert.show('确定')" />

       第二种;

<s:Button label="确定">
		<s:click>
			<![CDATA[
				Alert.show("确定");
			]]>
		</s:click>
</s:Button>

       这种方式称之为内联,这种方式在flex中被支持的很好,在使用项目渲染器和项目编辑器的时候也可以这种方式使用。不过这种方式个人不推崇,逻辑比较混乱。

       第三种:

<fx:Script>
		<![CDATA[
			import mx.controls.Alert;			
			protected function submitClickHandler(event:MouseEvent):void
			{
				Alert.show("确定");				
			}			
		]]>
</fx:Script>
<s:Button label="确定" click="submitClickHandler(event)" />

       这种方式比较常见,event参数是flex内部帮我们传递的。

       第四种:

<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.FlexEvent;			
			//creationComplete事件调用函数
			protected function creationCompleteHandler(event:FlexEvent):void
			{
				submit.addEventListener(MouseEvent.CLICK, submitClickHandler);
			}			
			protected function submitClickHandler(event:MouseEvent):void
			{
				Alert.show("确定");
			}			
		]]>
</fx:Script>
<s:Button id="submit" label="确定" />

       这种方式常用于动态创建组件或者分离方式构建自定义组件的时候使用。

       在实际开发中,我们常用的方式就是第三种和第四种。到此,内容结束,下一节讲的主要内容是使用事件在父子组件中传输数据。

       ps:我的博客刚刚开始写,如果大家对我的博客形式和博文内容有什么建议的话,欢迎提出,下篇《Flex事件机制(二)》.,敬请关注。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏从零开始的linux

bash

显示当前系统的进程数 # pstree init─┬─AliHids───4*[{AliHids}] ├─AliYunDun───8*[{AliYun...

3048
来自专栏前端杂货铺

iframe编程的一些问题

前几天做一个用iframe显示曲线图的demo,发现对iframe的contentDocument绑定 onclick事件都无效,而在页面中对iframe.co...

3136
来自专栏DeveWork

添加WordPress评论输入邮箱实时显示Gravatar头像功能

这个不是什么新鲜的功能了,这个功能即是实现当留言评论时,你输入email后,就会实时显示你的Gravatar头像。对于提高用户体验是有非常的帮助,特别是用户评论...

1965
来自专栏专业duilib使用+业余界面开发

duilib中将xml封装为控件简单示例(简单自定义控件,封装几个基本控件合为1个自定义控件)

2507
来自专栏Web 开发

看来已经很多人用SAE勒

今天把无觅插件For SAE的方法提交给了无觅官方,今晚他们回了邮件给我,说正好很多人找他们要,我就顺势谷歌了一下~

801
来自专栏Gcaufy的专栏

打造小程序组件化开发框架

这篇主要介绍在使用小程序数月之后,结合自己的开发习惯,总结出一套支持组件化的开发框架。希望对大家使用 WePY 有所帮助。

4K2
来自专栏超然的博客

肢解 HTTP 服务器构建

所有请求数据都在 request对象中,数据解析,还需要 url, querystring模块

911
来自专栏码生

Chrome 浏览器最牛插件之一 Vimium

最近学习了一下,整理了一下官方的默认按键。其中我使用到的都进行了中文翻译,一些没有翻译的是我没有使用的,这部分理解不深,不想误导大家,所以将英文原文放在这里,还...

1591
来自专栏破晓之歌

移动web开发适配秘籍Rem(推荐) 原

691
来自专栏码农阿宇

html基础加强2

1.表单元素 表单元素一定要提交在form标签里面 2.id和name 所有元素都有ID,但只有表单元素才有name ID不可以重复,name可以重复...

2888

扫码关注云+社区