ExtJS 自定义组件
最后更新时间:2010-12-08 16:07
用一段时间EXT,觉得自定义组件还是很有必要
1、不改变Ext的编码风格
2、易于重复利用
扩展可能是基于官方控件的扩展也可能是基于官方基础组件扩展,第一种比较常用,第二种我都去网上Download。。。
第一种扩展
比如需要一个文章列表
//完全复制一个自己的grid,没有意义
var myArticleList = Ext.extend(Ext.grid.GridPanel,{});
//初始化store
var myArticleList = Ext.extend(Ext.grid.GridPanel,{
initComponent:function(){
myArticleList.superclass.initComponent.call(this);
this.store = new Ext.data.JsonStore({
fields:['asdf'],
url:'www.google.com'
});
}
});
可以在initComponent中初始化需要的属性,但是重载这个函数一定要记得执行原函数,否则初始化不正确,
myArticleList.superclass.initComponent.call(this);
其他就简单了,在里面写上想要的东西,分页、工具条、事件。。。
另外还有个方法就是重载constructor方法,大多数组件的构造函数需要一个config对象,记得在构造函数中写上:
Ext.apply(this,config);
myArticleList.superclass.constructor.call(this);
ExtJs在使用中尽量将功能封装入模块中,合理细化模块。最后像积木一样搭建起来便可。最终的代码可能是
new Ext.Viewport({
items:[new ****,new ****,new ****]
});