Extjs4 类的定义和扩展

来源：互联网发布：mac安装windows软件编辑：程序博客网时间：2024/06/02 03:44

一般定义方式，注意方法和函数的添加方式不同。（添加函数只能用override方式添加不知为什么，有知道的，请搞之。）

定义一个类，并给他一个方法

   1: Ext.define('Simple.Class',{

   2:     welcome:function(){

   3:         alert('Welcome to the app');

   4:     }

   5: });

使用Ext.override方法对已有类进行重载并添加函数

   1: Ext.override(Simle.Class,{

   2:     goodBye:function(){

   3:         alert('Goodbye');

   4:     },

   5:     funAll:function(){

   6:         this.welcome();

   7:         this.goodBye();

   8:     }

   9: });

实例化类对象，并调用新的方法

   1: var app = new Simple.Class();

   2: app.runAll();   //Welcome to the app     Goodbye

重载的另一种写法

   1: Simple.Class.override({

   2:    // New members...

   3: });

实际例子：

Ext.define('MyButton',{   extend:'Ext.Action',   initComponent: function(){     var me = this;     var initEnable = true;       //初始权限   }});Ext.override(MyButton,{         mysetenable:function(b){   //增加自定义函数设置按钮权限         if ( this.initEnable ) {         if (b){         this.enable();         }         else{         this.disable();         }         }         else{         this.disable();         }         }});

例子2：

Ext.define('PO_Head_Add_Panel', {    extend: 'Ext.form.Panel',    alias: 'widget.PO_Head_Add_Panel',    //height:400,    //width:600,     frame: true,     layout: 'anchor',   //该form分为两列     bodyPadding: 5,      //偏移5px     //baseCls: "x-plain",  //指定使用系统背景色     //defaults: { anchor: "95%", msgTarget: "side" },     //   anchor: '100%',     defaults:{//统一设置表单字段默认属性                //autoFitErrors : false,//展示错误信息时是否自动调整字段组件宽度                labelSeparator :'：',//分隔符                labelWidth : 60,//标签宽度                //width : 150,//字段宽度                allowBlank : false,//是否允许为空                //blankText : '不允许为空', //若设置不为空，为空时的提示                labelAlign : 'right',//标签对齐方式                msgTarget :'qtip'          //显示一个浮动的提示信息                //msgTarget :'title'       //显示一个浏览器原始的浮动提示信息                //msgTarget :'under'       //在字段下方显示一个提示信息                //msgTarget :'side'        //在字段的右边显示一个提示信息                //msgTarget :'none'        //不显示提示信息                //msgTarget :'errorMsg'    //在errorMsg元素内显示提示信息     },    items:[{            xtype:'combobox',                name: 'ToAddress',                labelWidth:70,                width:600,                queryMode: 'local',                store:TmpAddressStore,                displayField: 'AddrName',                valueField: 'AddrName',                editable : false,// 是否允许输入forceSelection : true,// 必须选择一个选项                msgTarget: 'side',                allowBlank: false,//是否允许空值                fieldLabel: '送货地址'    },{            xtype:'textfield',                name: 'HRemark',                labelWidth:70,                width:600,                msgTarget: 'side',                allowBlank: false,//是否允许空值                fieldLabel: '备注'    }],     initComponent: function(){      var me = this;     var PoType = '';       //可以定义属性   obj.PoType 使用     var TmpHeadRec = Ext.create('PO_HeadData');            Ext.apply(this, {         buttons: [{            text: '保存',           handler:function(){              if (me.getForm().isValid()) {   //判断提交的数据是否符合正则表达式//保存功能              }          }        }, {            text: '取消',            handler: function () {                me.ownerCt.hide();             }                 }],     SetFormValue:function(){       //自定义方法  obj.SetFormValue() 方式调用             me.TmpHeadRec = HeadStore.getAt(0);me.getForm().findField('POType').setValue(me.TmpHeadRec.get('POType'));me.getForm().findField('PONum').setValue(me.TmpHeadRec.get('PONum'));     }       });           this.callParent(arguments);     }    });