Ext JS学习第十七天 事件机制event（二）

此文仅有继续学习笔记；

昨天说了三种邦定事件的方法，今天说一下自定义事件

假设现在又这样的情景一个自定义的事件

       没有用到事件处理的场景
        母亲问孩子和不饿—>
                             <-- 孩子
                               饿了-->给一瓶牛奶
                               不饿-->不给
        用了事件的场景
        母亲给孩子一个瓶牛奶-->
                        孩子拿到牛奶感觉饿了就喝
                        感觉不饿就不喝

角色功能分析:
            孩子:应该有自己能拿到牛奶判断饿不饿的方法,当母亲给他牛奶的时候调用这个方法.
            那么孩子就要有一个业务事件时刻监听这母亲什么时候给自己牛奶
            母亲:调用孩子拿牛奶的方法,并且传入一瓶牛奶   
请看栗子：

(function(){
    Ext.onReady(function(){
        Ext.define("children",{
            extend:'Ext.util.Observable',//Ext.util.Observable 事件的基类,他为所有支持事件机制的extjs组建提供事件的支持,如果我们自己创建新的组建需要有时间的支持那么我们就继承他
            constructor:function(){
                this.state = "hungry",//目前所属的状态 full,hungry
                this.setMilk = function(milk){ 孩子接受母亲牛奶的方法
                    this.fireEvent('hungry',milk);//触发事件
                },
                this.addEvents({'hungry':true}),//添加事件
                this.addListener("hungry",function(milk){   //事件的监听方式注册这个事件addListener
                    if(this.state == 'hungry'){
                        this.drink(milk); //喝牛奶
                    }else{
                        alert("我不饿");                
                    }
                }),
                this.drink = function(milk){
                    alert("我喝掉了一瓶牛奶: "+milk);
                }
            }
        });
        var children = Ext.create("children",{});
    </span><span style="color: #008000">//</span><span style="color: #008000">母亲调用孩子的接受牛奶的方法</span>
    children.setMilk("三鹿牛奶"<span style="color: #000000">);
    
});
</span><span style="color: #008000">/*</span><span style="color: #008000">**
 * 为对象添加一个事件addEvents--&gt;事件的监听方式注册这个事件addListener--&gt;触发了这个事件的动作fireEvent
 </span><span style="color: #008000">*/</span><span style="color: #000000">

})();

 

个人网站 www.fishcmonkey.com，每天进步一点