`
apache
  • 浏览: 6481 次
社区版块
存档分类
最新评论

ext mon 和 on 的区别

阅读更多
mon和on方法都是给对象添加事件句柄的方法:
1.on方法实际上addListener的简写, 是在Ext.util.Observable中定义的,其作用是
"Appends an event handler to this object.",也就是给当前对象添加事件处理函数
代码如下(没太看懂) 是个递归的函数
        addListener : function(eventName, fn, scope, o){
            var me = this,
                e,
                oe,
                isF,
            ce;
            if (ISOBJECT(eventName)) {
                o = eventName;
                for (e in o){
                    oe = o[e];
                    if (!filterOptRe.test(e)) {
                        me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o);
                    }
                }
            } else {
                eventName = toLower(eventName);
                ce = me.events[eventName] || TRUE;
                if (typeof ce == "boolean") {
                    me.events[eventName] = ce = new EXTUTIL.Event(me, eventName);
                }
                ce.addListener(fn, scope, ISOBJECT(o) ? o : {});
            }
        },


2. mon方法是在Ext3为了解决内存泄漏问题(啥问题不知道,应该是部分句柄可能存在无法自动删除的情况)作出的改进,定义于Component类, 可以在当前对象内添加在外部对象的事件句柄, 在当前对象销毁的时候会自动清除句柄。代码如下:
    mon : function(item, ename, fn, scope, opt){
        if(!this.mons){
            this.mons = [];
            this.on('beforedestroy', this.clearMons, this, {single: true});
        }

        if(Ext.isObject(ename)){
        	var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;

            var o = ename;
            for(var e in o){
                if(propRe.test(e)){
                    continue;
                }
                if(Ext.isFunction(o[e])){
                    // shared options
			        this.mons.push({
			            item: item, ename: e, fn: o[e], scope: o.scope
			        });
			        item.on(e, o[e], o.scope, o);
                }else{
                    // individual options
			        this.mons.push({
			            item: item, ename: e, fn: o[e], scope: o.scope
			        });
			        item.on(e, o[e]);
                }
            }
            return;
        }


        this.mons.push({
            item: item, ename: ename, fn: fn, scope: scope
        });
        item.on(ename, fn, scope, opt);
    },

从代码中,很清楚的看到当前对象在模板方法beforedestroy中会自动的进行句柄清理工作,减少了内存泄漏的情况。
Ext 官方推荐所有的componet类添加句柄时使用mon替代on

引用
//Old Style
this.el.on('click', this.onClick, this);

//New Style
this.mon(this.el, 'click', this.onClick, this);
分享到:
评论

相关推荐

    标准库功能块引脚说明.docx

    - `SP_TRK_ON` 开启设定值跟踪,`SP_EXT` 和 `SPEXT` 用于外部设定值输入。 - `SPEXTHLM` 和 `SPEXTLLM` 分别设定外部设定值的上限和下限。 - `LIOP_INT_SEL` 和 `LIOP_MAN_SEL` 决定内给定/外给定和手动/自动的...

    extjs自定义控件

    - **监听器**:自定义控件可以添加自己的事件,通过`listeners`配置项或`addEvents`方法定义事件,然后使用`on`、`un`或`mon`方法添加事件监听器。 - **事件代理**:利用`delegate`配置项,可以在控件内部对特定...

    ExtJS 事件笔记

    - **组件事件**:对于Ext.Component的事件,Ext3.0引入了`mon`方法,可以有效防止内存泄露,如`this.mon(this.el, 'click', this.click, this)`。 - **Ext.EventManager**:ExtJS的事件管理策略封装在这个单体类中...

    Extjs 4.11 重写 Panel 添加 click事件

    5. **销毁Panel时自动移除事件监听器**:如果你的Panel会在应用的某个阶段被销毁,推荐使用`mon`和`mun`这两个方法,它们会在Panel销毁时自动移除监听器,避免内存泄漏: ```javascript var listener = function() {...

    extjs表格文本启用选择复制功能具体实现

    具体来说,会在表格的`<td>`标签上应用`unselectable="on"`属性,使得文本无法被选中和复制。要启用文本选择复制功能,我们需要自定义样式覆盖默认的CSS,并通过JavaScript代码修改ExtJS组件的默认行为。 ### 知识...

    pic-on-qiniu::party_popper: 基于七牛的图床,支持拖拽上传,复制上传,批量上传以及浏览历史记录

    图床on七牛基于七牛的图床插件,图片保存在七牛的 Bucket 中,具体实现原理可以参考 。安装Chrome 应用商店下载...如配置为 image/$(year)$(mon)$(day)/$(etag)$(ext),则最终图片的保存路径为 image/20190401/FlM6_0

    对数据库的查询

    // Date: Mon Aug 27 11:07:02 CST 2007 // Content-Type: text/html // Expires: 1188443222000 // Last-Modified: Fri Aug 24 12:29:00 CST 2007 // Content-Length: 44966 // ===content=== // <html><head> ``` ...

    linux常用系统维护命令

    - **示例**: 输出类似`/dev/sda1 on / type ext4 (rw,errors=remount-ro)`的信息。 **4. 查看磁盘分区** - **命令**: `fdisk -l` - **用途**: 显示磁盘分区表信息。 - **示例**: 输出类似`Disk /dev/sda: 500.1...

    8-07-14_MegaCLI for linux_windows

    SCGCQ00341724 Defect FW allows a firmware to be flashed through Online FW Update method in DOS and then breaks into montask SCGCQ00342848 Defect Add Adapter restart support in CLI SCGCQ00342993 Defect...

    SSH客户端操作Linux

    ssh: SSH Secure Shell 3.2.9.1 (non-commercial version) on i686-pc-linux-gnu 2、用SSH登录到远程主机 当你第一次使用ssh登录远程主机时,会出现没有找到主机密钥的提示信息。输入"yes"后,系统会将远程主机的...

    linux-0.11 [内核源代码带英文注解]

    * in NO COPY ON WRITE (!!!), until an execve is executed. This * is no problem, but for the stack. This is handled by not letting * main() use the stack at all after fork(). Thus, no function * ...

    CMD命令手册(很全的).pdf

    - `AT 22:00 /EVERY:MON,TUE,FRI "C:\Scripts\backup.cmd"`: 每周一、周二和周五晚上10点执行备份脚本。 ##### 3. ATTRIB - **用途**:显示或更改文件属性。 - **语法**: ``` ATTRIB [+R | -R] [+H | -H] [+S |...

    linux内核 0.11版本源码 带中文注释

    #define EXT_MEM_K (*(unsigned short *)0x90002) // 1M 以后的扩展内存大小(KB)。 #define DRIVE_INFO (*(struct drive_info *)0x90080) // 硬盘参数表基址。 #define ORIG_ROOT_DEV (*(unsigned short *)0x901FC...

Global site tag (gtag.js) - Google Analytics