首页  >  文章  >  web前端  >  Extjs4 类的定义和扩展实例_extjs

Extjs4 类的定义和扩展实例_extjs

WBOY
WBOY原创
2016-05-16 17:30:481039浏览

一般定义方式,注意方法和函数的添加方式不同。(添加函数只能用override方式添加不知为什么,有知道的,请搞之。)
定义一个类,并给他一个方法

复制代码 代码如下:

Ext.define('Simple.Class',{
welcome:function(){
alert('Welcome to the app');
}
});

使用Ext.override方法对已有类进行重载并添加函数
复制代码 代码如下:

Ext.override(Simle.Class,{
goodBye:function(){
alert('Goodbye');
},
funAll:function(){
this.welcome();
this.goodBye();
}
});

实例化类对象,并调用新的方法
复制代码 代码如下:

var app = new Simple.Class();
app.runAll(); //Welcome to the app Goodbye

重载的另一种写法
复制代码 代码如下:

Simple.Class.override({
// New members...
});

实际例子:
复制代码 代码如下:

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',
エイリアス: 'widget.PO_Head_Add_Panel',
//height:400,
//width:600,
frame: true,
layout: 'anchor', //フォームは 2 つの列に分割されます
bodyPadding: 5, //Offset 5px
//baseCls: "x-plain", //システムの背景色を使用するように指定します
//デフォルト: { アンカー: "95%", msgTarget: "side" },
// アンカー: '100%',
defaults:{//フォームフィールドのデフォルト属性を均一に設定します
//autoFitErrors: false,//エラーメッセージを表示するときにフィールドコンポーネントの幅を自動的に調整するかどうか
labelSeparator:':',//Separator
labelWidth: 60,//ラベル幅
//width: 150,//フィールド幅
allowBlank: false,//空にすることが許可されるかどうか
//blankText: '許可されませんto be empty', //空でない場合は、空のときにプロンプ​​トを表示します。
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 = '' //
var TmpHeadRec = Ext.create を使用して属性 obj.PoType を定義できます。 ('PO_HeadData');

Ext .apply(this, {
buttons: [{
text: '保存',
handler:function(){
if (me .getForm().isValid()) { //入稿データが正規表現に適合しているか判定
//保存関数
}
}
}, {
text: 'Cancel ',
handler: function () {
me.ownerCt.hide();
}
}],
SetFormValue:function(){ // カスタム メソッド obj.SetFormValue を呼び出します()
me.TmpHeadRec = HeadStore.getAt( 0);
me.getForm().findField('POType').setValue(me.TmpHeadRec.get('POType')); .getForm().findField('PONum').setValue (me.TmpHeadRec.get('PONum'));

this.callParent(arguments); 🎜>}
});


声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn