ExtJs源码分析与学习—ExtJs事件机制(四)
ExtJs组件事件——ExtJs自定义事件的处理
????? 下面通过对组件的事件对象和事件机制两个方面分别对源码进行分析。
组件事件对象????? ExtJs组件事件对象是通过Ext.util.Event类来完成的,其实在浏览器元素事件中部分功能的实现已用到了该类。下面看该类的实现代码
?
this.addEvents("fired","quit");
该函数只在events中保存了事件名,这样做的好处是减少内存的占有,提高效率,在addListener才会正在的添加监听函数。运行监听函数是通过fireEvent函数来实现的,代码如下?
?
????? 运行该代码时,首先添加观察者事件和拦截对象,内存中的快照(部分)为:
Ext.util.Observable中
this.methodEvents = {onSelect:{originalFn : onSelect,methodName:'onSelect',after :[{scope:scope,fn:afterSelectFn}],before :[{scope:scope,fn:beforeSelectFn}]}}
?
在实例化Interceptor对象后,添加被观察者时Ext.util.Observable.addListener中会初始化
this.events[eventName] = ce = new EXTUTIL.Event(this, eventName);,此时会把Ext.util.Observable对象传入Ext.util.Event,当然包括属性methodEvents。当点击按钮时,会调用Ext.util.Observable.fireEvent,而该方法中又会调用EXTUTIL.Event.fire执行firefn函数,即beforeSelectFn,见代码
if(l && l.fireFn.apply(l.scope || me.obj || window, args) === FALSE) {
??????????????????? return (me.firing = FALSE);
??????????????? }
?
????? 以上详细的介绍了类Ext.util.Observable。Ext强大的事件功能远不至此,它还提供了与事件相关的快捷键、导航键和鼠标按键事件等。且听下回分解。
?