ext 自定义组件封装思路

//命名空间
Ext.namespace('Ext.MyComponent');

Ext.MyComponent.MyGridPanel=function(config){
//grid用到的数据如url stroe 等
if(config)config={};
this.url=config.url;;
this.store=config.url;
this.pagingToolbar=new ...;
this.buttons=[{text:'增加',handler:this.addRow.createDelegate(this,[config])}]
//改变作用域 吧自定义的 属性 加载此Ext.MyComponent.MyGridPanel组件上
Ext.apply(this,{
//自己定义属性
border:false,
region:'center',
frame:true,
store:this.store,
bbar:this.pagingToolbar,
buttons:this.buttons
});

Ext.MyComponent.MyGridPanel.superclass.constructor.apply(this,
arguments);
}
//继承 gridpanel 并且覆盖或者自定义 方法
Ext.extend(Ext.MyComponent.MyGridPanell, Ext.grid.EditorGridPanel, {
addRow:function(config){
//TODO youself method
//such as  grid=config.grid;  store=config.store 
}
closeWin:function(config){
this.close();
}
});


用的时候直接 构造

var config={};
    config.url="xxxxxxxxxxxxx";
    config.store="xxxxxxxxxxxxxx"
var grid1=new Ext.MyComponent.MyGridPanel(config);

你可能感兴趣的:(ext)