ext编写自定义组件之2

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 ****]

});