Ext.ComponentQuery.query()

时间:2023-03-08 23:25:07
Ext.ComponentQuery.query()

转载:http://blog.****.net/jiushuai/article/details/7938476

用来找特点的所有容器(Ext.container.Container)或是通过Ext.ComponentManager找特定的所有组件
1.当找组件的时候,相当于调用Ext.ComponentQuery.query()
可以接收的参数有
1)xtype
//找xypte为panel的所有组件
var panelsArray = Ext.ComponentQuery.query('panel');
2)组件的itemId或id的属性值
找所有id为myct的panel组件,注意空格表示与操作(&&)
var panelsWithinmyCt = Ext.ComponentQuery.query('#myCt panel');
注:>表示直接,豆表示或操作
//表示id为myct的直接子元素中panel的组件
var directChildPanel = Ext.ComponentQuery.query('#myCt > panel');
//表示gridpanel与treepanel组件
var gridsAndTrees = Ext.ComponentQuery.query('gridpanel, treepanel');
3)根据属性查找
//表示如果组件有autoScroll属性,那么它就被先中了
var panelsWithinmyCt = Ext.ComponentQuery.query('component[autoScroll]');
var panelsWithinmyCt = Ext.ComponentQuery.query('panel[title="Test"]');
panel[title="Test"]
4)根据组件的一些表达式式的属性,如果表达式的返回值为true,那么对应的组件就被先中
//如果组件的调用isDisabled()为true的话,那么此组件就被选中
var disabledFields = myFormPanel.query("{isDisabled()}");
5)伪类选择器(Pseudo classes)
默认包含的有not,last,
//表示在document中找最后的panel组件
var panelsArray = Ext.ComponentQuery.query('panel:last');
//自定义的
Ext.ComponentQuery.pseudos.invalid = function(items) {
    var i = 0, l = items.length, c, result = [];
    for (; i < l; i++) {
        if (!(c = items[i]).isValid()) {
            result.push(c);
        }
    }
    return result;
};
var invalidFields = myFormPanel.query('field:invalid');
if (invalidFields.length) {
    invalidFields[0].getEl().scrollIntoView(myFormPanel.body);
    for (var i = 0, l = invalidFields.length; i < l; i++) {
        invalidFields[i].getEl().frame("red");
    }
}

2.查找容器的时候
可以用Ext.container.Container.query().此方法其实是以container为根元素调用Ext.ComponentQuery.query
Ext.container.Container.down
Ext.container.Container.child
Ext.Component.up.