Ext自定义控件 - 自学ExtJS

本文所有思想表达均为个人意见，如有疑义请多批评，如有雷同不甚荣幸。

转载请注明出处：Nutk'Z http://www.cnblogs.com/nutkz/p/3448801.html

在用到ExtJS的扩展控件时经常会想到，这个控件有哪些属性，有哪些方法以及事件。

一般都是把前人用过的，或者是网上down的拿过来改改，如果前人没有使用这个控件的某个属性，而你又需要时就会发现，这怎么连这个功能都没有！！

其实并不一定没有，也可能是设定成了默认属性。

 

那么接下来就看原代码

 

一般控件会采用继承方式(个人认为是继承关系)，看ExtJS的源代码也是这么写的

Ext.XXX = Ext.extend(父类, {配置项})

这可以说明你使用的这个控件他继承的来源，也就是他与谁有密不可分的关系

 

然后往下看会发现，在他的配置项里也是存在类似于

XXX: xxx

的属性配置，前者(XXX)是他的配置项名称(Name)，后者(xxx)是他的配置内容(Value)

这个在使用该控件的时候是可以重新配置修改的，有时候这里可能隐藏着你需要的属性

 

当然还会发现，有一些是这样写的

XXX: function([params]){}

这样的个人觉得应该是说他具有哪些方法，当然事件应该也会这么写吧。但是因ExtJS已经封装了很多事件，所以在一些扩展控件里就看不到对于事件的定义了。

 

当然我们也可以在ExtJS的源代码中看到事件的定义

onClick : function(e){ this.processEvent('click', e); }

onDblClick : function(e){ this.processEvent('dblclick', e); }

processEvent : function(name, e){ this.view.processEvent(name, e); }

好像很简单吧

 

在然后就可能会看到有一些类似

initComponent: function(){}

初始化之类的函数，initComponent可能是继承来的一个虚方法需要重构的吧(个人觉得是这样)，当然也不止这一个方法，但是个人感觉initComponent是一个入口方法吧

 

好了，按照这种思路再剩下的就可以顺藤摸瓜了。

其实这么看来ExtJS并不难，他需要的可能就是最基本JavaScript的知识，当然这方面本人还是很缺乏的。

期待接下来的学习成果。。。