EXT中xtype的含義分析
更新時間:2010年01月07日 21:04:22 作者:
根據(jù)我在論壇上的觀察,xtype用起來的時候疑惑會比較多。甚至有些人根本忽略xtype,或者不清楚它是什么。所以我決定闡述一下這個xtype的概念。
序言
根據(jù)我在論壇上的觀察,xtype用起來的時候疑惑會比較多。甚至有些人根本忽略xtype,或者不清楚它是什么。所以我決定闡述一下這個xtype的概念。
定義
xtype就是一個代表類(Class)的標(biāo)識名字。
譬如,你有這個類,名字是Ext.ux.MyGrid。正常情況下你需要用這個名字來實(shí)例化這個類(創(chuàng)建類的對象)。
除了類名外,你還可以這樣登記類的xtype:
Ext.reg('mygrid', Ext.ux.MyGrid);
其中xtype 是 mygrid 而類名的一般形式是Ext.ux.MyGrid。上面的語句登記了新的xtype,換種說法說,xtype mygrid 與類 Ext.ux.MyGrid是連在一起的。
到底有什么好處?
試想一下,你手頭上的是一個大型的項(xiàng)目,為了響應(yīng)用戶的操作,程序里面包含者大量的對象(windows、forms、grids)。用戶點(diǎn)擊圖標(biāo)或按鈕,就會新建一個窗體,窗體里面又有g(shù)rid,最終在屏幕上渲染出來。
嗯,我們回到Ext2.x之前的編碼,那時候我們實(shí)例化所有對象是頁面第一次加載后就進(jìn)行的(程序代碼第一次的運(yùn)行)。在客戶端內(nèi)存中,Ext.ux.MyGrid類的對象已經(jīng)存在,等待用戶的點(diǎn)擊。 同樣是這個grid,假設(shè)你上百個的實(shí)例,...是多么浪費(fèi)寶貴的資源?。『芏鄃rid其實(shí)用戶未必會點(diǎn)擊讓它出現(xiàn)。
延時實(shí)例化
如果你使用xtype,那么在內(nèi)存中的僅僅是一個配置項(xiàng)對象,像:
{xtype:'mygrid", border:false, width:600, height:400, ...}
消耗沒有復(fù)雜的實(shí)例對象來得大。
嗯,用戶點(diǎn)擊按鈕或圖標(biāo)會怎么樣呢?Ext會辨認(rèn)出它是一個準(zhǔn)備要渲染的grid但不立刻實(shí)例化,Ext在ComponentMgr的幫忙下明白這么一回事:“如果我要實(shí)例化xtype mygrid的對象,我就知道要創(chuàng)建的實(shí)際是類Ext.ux.MyGrid的對象”。即如下列代碼:
create : function(config, defaultType){
return new types[config.xtype || defaultType](config);
}
等價于:
Java代碼
return new Ext.ux.MyGrid(config);
然后實(shí)例化grid,進(jìn)行渲染和顯示。謹(jǐn)記:需要的時候才實(shí)例化。
根據(jù)我在論壇上的觀察,xtype用起來的時候疑惑會比較多。甚至有些人根本忽略xtype,或者不清楚它是什么。所以我決定闡述一下這個xtype的概念。
定義
xtype就是一個代表類(Class)的標(biāo)識名字。
譬如,你有這個類,名字是Ext.ux.MyGrid。正常情況下你需要用這個名字來實(shí)例化這個類(創(chuàng)建類的對象)。
除了類名外,你還可以這樣登記類的xtype:
Ext.reg('mygrid', Ext.ux.MyGrid);
其中xtype 是 mygrid 而類名的一般形式是Ext.ux.MyGrid。上面的語句登記了新的xtype,換種說法說,xtype mygrid 與類 Ext.ux.MyGrid是連在一起的。
到底有什么好處?
試想一下,你手頭上的是一個大型的項(xiàng)目,為了響應(yīng)用戶的操作,程序里面包含者大量的對象(windows、forms、grids)。用戶點(diǎn)擊圖標(biāo)或按鈕,就會新建一個窗體,窗體里面又有g(shù)rid,最終在屏幕上渲染出來。
嗯,我們回到Ext2.x之前的編碼,那時候我們實(shí)例化所有對象是頁面第一次加載后就進(jìn)行的(程序代碼第一次的運(yùn)行)。在客戶端內(nèi)存中,Ext.ux.MyGrid類的對象已經(jīng)存在,等待用戶的點(diǎn)擊。 同樣是這個grid,假設(shè)你上百個的實(shí)例,...是多么浪費(fèi)寶貴的資源?。『芏鄃rid其實(shí)用戶未必會點(diǎn)擊讓它出現(xiàn)。
延時實(shí)例化
如果你使用xtype,那么在內(nèi)存中的僅僅是一個配置項(xiàng)對象,像:
復(fù)制代碼 代碼如下:
{xtype:'mygrid", border:false, width:600, height:400, ...}
消耗沒有復(fù)雜的實(shí)例對象來得大。
嗯,用戶點(diǎn)擊按鈕或圖標(biāo)會怎么樣呢?Ext會辨認(rèn)出它是一個準(zhǔn)備要渲染的grid但不立刻實(shí)例化,Ext在ComponentMgr的幫忙下明白這么一回事:“如果我要實(shí)例化xtype mygrid的對象,我就知道要創(chuàng)建的實(shí)際是類Ext.ux.MyGrid的對象”。即如下列代碼:
復(fù)制代碼 代碼如下:
create : function(config, defaultType){
return new types[config.xtype || defaultType](config);
}
等價于:
Java代碼
復(fù)制代碼 代碼如下:
return new Ext.ux.MyGrid(config);
然后實(shí)例化grid,進(jìn)行渲染和顯示。謹(jǐn)記:需要的時候才實(shí)例化。
相關(guān)文章
學(xué)習(xí)ExtJS(一) 之基礎(chǔ)前提
學(xué)習(xí)ExtJS前提條件,大家要想學(xué)習(xí),需要一些基礎(chǔ)知識。2009-10-10Extjs EditorGridPanel中ComboBox列的顯示問題
EditorGridPanel中嵌入ComboBox通常不會正常顯示ComboBox的store中本想顯示字段,而是顯示的EditorGridPanel中 store的dataindex指定的字段內(nèi)容。2011-07-07解決extjs grid 不隨窗口大小自適應(yīng)的改變問題
在使用grid的時候窗口改變了但是grid卻不能自適應(yīng),下面有個不粗的解決方法,大家可以參考下2014-01-01Extjs3.0 checkboxGroup 動態(tài)添加item實(shí)現(xiàn)思路
Extjs3.0中的CheckboxGroup默認(rèn)不能動態(tài)添加item,如需要數(shù)據(jù)動態(tài)創(chuàng)建,試著創(chuàng)建整個CheckboxGroup,而不是動態(tài)添加item,具體實(shí)現(xiàn)如下,感興趣的朋友可以了解下2013-08-08Extjs407 getValue()和getRawValue()區(qū)別介紹
mydate.getvalue() 返回的是對象;mydate.getRawValue() 返回的是該控件的顯示值,不知道的朋友可以參考下哈2013-05-05