get方法:
get( String id : Object
- 1.
通过id获取一个组件实例。
参数
l id : String
- 1.
组件的id
返回值
l Object
- 1.
组件实例,或者unfined。
但是上述方法,只能实现获取一个组件的目的,如果你想要获取一个类型的所有组件集合、具有某些特点的组件集合,Ext.ComponentManager.get()就无能为力了。Sencha Touch中怎么做到这一点?这就是本篇存在的目的了。来,用组件选择器吧,它的query方法能让你轻松地实现这一目标。下面让我们来认识一下它:
query( String selector, Ext.Container root : Ext.Component[]
- 1.
获取一个组件集合。
参数
l selector : String
- 1.
一个字符串形式的选择器。
l root : Ext.Container(可选)
- 1.
一个容器组件或一个容器组件集,搜索范围将被限定在这些容器里面。
返回值
l Ext.Component[]
- 1.
符合条件的组件集,或者一个空集合。
各种类型的选择器
如果你学过css的选择器,那么肯定会对以下内容十分熟悉。
ID选择器
根据组件id来选择组件,具有***性。前面以”#”号来标志:
//返回itemid或者id为“panel”的组件实例
var panel = Ext.ComponentQuery.query('#panel');
- 1.
- 2.
类别选择器
类选择器根据类的xtype来选择,可选择前面是否以”.”来标志,如:
//根据xtype返回所有Ext.List实例
var lists = Ext.ComponentQuery.query('list');
var lists2 = Ext.ComponentQuery.query('.list');
- 1.
- 2.
- 3.
属性选择器
根据组件的属性来选择,可以选择具有某个属性的组件,或者属性为特定值的组件。
//返回具有iconCls属性的Ext.Button的实例
var btnOk= Ext.ComponentQuery.query('button[iconCls]');
- 1.
- 2.
也可以选择某个属性为特定值的组件
//返回text属性为“ok”的Ext.Button的实例
var btnOk= Ext.ComponentQuery.query('button[text = "ok"]');
- 1.
- 2.
后代选择器
后代选择器也称为包含选择器,用来选择特定容器或容器组的后代,后代选择器由两个常用选择器,中间加一个空格表示。其中前面的选择器选择父组件,后面的选择器选择后代组件。
//返回所有id为“myCt”的容器中Ext.Panel实例
var panelsWithinmyCt = Ext.ComponentQuery.query('#myCt panel');
- 1.
- 2.
子选择器
请注意这个选择器与后代选择器的区别,子选择器(child selector)仅是指它的直接后代,而后代选择器是作用于所有子后代组件。后代选择器通过空格来进行选择,而子选择器是通过“>”进行选择,我们看下面的代码:
//返回所有id为“myCt”的容器的子组件中的Ext.Panel实例
var directChildPanel = Ext.ComponentQuery.query('#myCt > panel'
- 1.
- 2.