使用Ext实现js的继承,以及扩展Ext组件的思路

请看下面代码:

<SCRIPT LANGUAGE="JavaScript"> <!-- function a(config){ config=config||{}; alert(this.name); if(this.fn) this.fn(); Ext.apply(this, config); //将传进来的配置属性copy到this } var b = Ext.extend(a,{ name:'lizi', fn:function(){alert('fn');} }); new a(); new b(); //--> </SCRIPT>

 

a为父类,通过上面的代码就可以在a方法的基础上扩展一个name属性,再扩展出一个fn()函数得到b。

 

调用new a() 会弹出一个 "undefined" 因为fn()不存在,所以没有执行fn()

调用new b()会弹出一个 "lizi",并且执行了fn(),弹出 "fn"

 

注意:这里一定要写new b(); 而不能只简单的调用b()

 

 

通过查看Ext组件继承关系,我们会在原代码里找到,基类调用this.initComponent()来初始化组件.initEvents()来初始化事件.

所以我们可以继承父类组件,重写initComponent、initEvents,并且用this.来增加属性或函数或绑定事件,

如果重名则会覆盖原有属性或函数.

 

代码第一句一定要写

子类.superclass.initComponent.call(this);

来调用父类的初始化方法.

 

在源代码里我们又找到Ext.reg("textarea",Ext.form.TextArea);

这是给组件注册xtype的名称.有了xtype我们就可以更方便的使用自己的组件了.