------------------------------------------------------------------------------ComponentQuery-----------------------------------------------------------------------------
想要获取某个组件并对其操作,通常使用Ext.getCmp('id');该方式是在整个DOM文档中进行查询,后来发现随着项目的进行,使用的组件愈多,这种方式势必影响查询效率,于是想使用一种更好地方式来查询组件以替代Ext.getCmp()。
1.ComponentQuery提供了一种类似CSS标签选择器的组件查询方式,他有两种调用方式:
(1)直接通过ComponetManager来查询:Ext.ComponentQuery.query()
(2)通过组件直接的Container来查询: combo.up('form').query()
2.优点:不用指定Id,防止Id冲突
3.使用方式:
(1)通过组件ID获取组件:"#组件ID”,如果通过这种方式,那么一定要记住在组件ID前添加#号。
(2)得到某一组件下所有的指定类型的组件:"panel>button”,这种方式是查找所有panel组件下的所有button组件。
(3)通过xtype:"treepanel”或".treepanel"。Ext.ComponentQuery.query('treepanel');
(4)通过up和down寻找上下级组件:combo.up('form') form.down('combo')
(5)通过previousNode寻找兄弟组件: myField.previousNode('textfield');
(6)通过组件的一些表达式式的属性,如果表达式的返回值为true,那么对应的组件就被选中,例如:如果组件的调用isDisabled()为true的话,那么此组件就被选中
var disabledFields = myFormPanel.query("{isDisabled()}");
(7)通过>寻找组件的直接子组件:Ext.ComponentQuery.query('#myCt > panel');
(8)通过组件的属性进行查找: Ext.ComponentQuery.query("combo[name='location']")
(9)伪类选择器(Pseudo classes)默认包含的有not,last。例如查找最后一个panel Ext.ComponentQuery.query("panel:last")
(10)通过自定义函数进行过滤:
Ext.ComponentQuery.pseudos.invalid = function(items) {
//...函数体
return result;
};
var invalidFields = myFormPanel.query('field:invalid');
如:创建一组件
{
xtype: 'button'
itemId : 'buttonItemId',
}
通过Ext.ComponentQuery.query()获取组件:
var comp = Ext.ComponentQuery.query("button[itemId='buttonItemId']")[0];
//Ext.ComponentQuery.query()返回的是控件数组,[0]返回的是该控件
//[注:有关Ext.ComponentQuery.query()方法使用查看Sencha touch API文档]
另外,还有一种方法获取组件,且效率较高:
* 先通过Ext.ComponentQuery.query(),获取组件所在页面。
var view = ComponentQuery.query('component_xtype'), // component_xtype页面类型
若要查找该页面id为:buttonId的组件,可用下面方法:
var comp2 = view.down('#buttonId');
通过这种方式查询组件,首先其范围限制到该组件所在的页面里,所以查询效率高。
----------------------------------------------------------------------Fitnesse-------------------------------------------------------------------------
1. |$wmCommon_paperworkAppClose= |define|cq=[id=wm-common-paperwork] tool[type=close] |
2. |$OverRecS_textValue= |define |cq=[cls=wm-entityChooser-selectedGrid] numberfield[name=overreceipttypevalue]|
3. |$OverRecS_radioGroup |define|cq=[itemId=overreceipttypevaluesupdefaultclient]|
4. |$OverRecS_radioQty |define|cq=#overreceipttypevaluedefaultclient #UQTY|