ExtJS 组件查询

Question

我希望使用组件查询功能来查找组件，而不是通过属性值，而是通过属性名称本身应该是通配符的属性名称。

所以我有一个具有以下配置的组件：

var component = Ext.create({
  xtype: 'container',
  foobar: 'something',
  foobar2: 'something else'
});

我希望能够找到所有属性以 foobar 开头的元素。像

var els = Ext.ComponentQuery.query('[foobar*]');

我将如何实现这一目标？这是一个选项吗？

Answer 1

我没有在文档中找到默认方式。一个可能的解决方案是一个自定义匹配器函数，它检查每个组件是否有以给定参数开头的属性。然后，您可以覆盖所有 ext 组件以具有此匹配器功能。（如果您已经在使用自定义组件，您可以制作 mixin）

例如：

    Ext.override(Ext.Component, {
        insensetivePropQuery: function(prop) {
            var matched = false;

            Ext.Object.each(this, function(key, value, myself) {
                if(Ext.String.startsWith(key, prop) === true) {
                    matched = true;
                    return false;
                }
            });
            return matched;
        }
    });

查询示例：

Ext.ComponentQuery.query('{insensetivePropQuery("foobar")}');

这是一个有效的煎茶 fiddle 示例（使用 ExtJS 7.3.x Material）：example

ExtJS 组件查询

ExtJS Component Query

extjs

extjs7