Extjs4 类的定义和扩展

本文主要是介绍Extjs4 类的定义和扩展，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

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

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

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

      2:     welcome:function(){

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

      4:     }

      5: });

2. 使用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: });

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

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

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

4. 重载的另一种写法

      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);}    
});

这篇关于Extjs4 类的定义和扩展的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---