Extjs 仅用于子元素的ComponentQuery选择器

我有一组动态组合的控制器/视图，每个都有一个“选择器”列表和一个“容器”，这样的容器可以有另一个选择器+容器对，等等。它们是同一根选择器+容器控制器的实例

这是控制器（抽象类）的标题定义：

问题是我不知道ComponentQuery选择器应该是什么，以便只将控制器的子元素与这样的itemId匹配。因为通过使用[itemId=“explorerContainer”]来匹配组件，它会全局匹配组件，从而响应组合树中最顶层的容器

在以前的ExtJS3实验中，我通过myComponent.getComponent（“…”）访问子元素，但现在没有getComponent（），我在ExtJS4中找不到等效的

---

提前感谢。

您的问题中混合了一些控制器和视图。例如“我的控制器的子元素”。控制器不是一个组件，只是事件的观察者。视图包含子组件等

您需要更加熟悉

Ext.ComponentQuery

类。你可以在你的应用程序或演示页面上的Firebug中进行实验。您只需打开firebug控制台并键入

Ext.ComponentQuery.query（'panel'）

——然后用您认为正确的表达式替换panel并测试它。如果你安装了Illuminations For Developers插件，你会得到Ext组件，而不是一般的JS对象，这是非常有帮助的

文档中有一些查询示例：。您会发现“

>

”符号将查询限制为直接子项

---

希望这有帮助。如果您没有发布更多的代码，我们可以帮助您创建一些选择器。

您在问题中混合了一些控制器和视图。例如“我的控制器的子元素”。控制器不是一个组件，只是事件的观察者。视图包含子组件等

您需要更加熟悉

Ext.ComponentQuery

类。你可以在你的应用程序或演示页面上的Firebug中进行实验。您只需打开firebug控制台并键入

Ext.ComponentQuery.query（'panel'）

——然后用您认为正确的表达式替换panel并测试它。如果你安装了Illuminations For Developers插件，你会得到Ext组件，而不是一般的JS对象，这是非常有帮助的

文档中有一些查询示例：。您会发现“

>

”符号将查询限制为直接子项

---

希望这有帮助。如果您没有发布更多的代码，我们可以帮助您创建一些选择器。

阅读Ext.ComponentQuery文档，我在其底部发现了以下内容：

“要轻松访问基于特定容器的查询，请参阅 Ext.container.container.query、Ext.container.container.down和 Ext.container.container.child方法。另请参见Ext.Component.up。“

因此Ext.container.ContainerView（xtype:container）实现了子元素（[selector]），它回答与选择器字符串参数匹配的第一个子元素

---

它正是我想要的。

阅读Ext.ComponentQuery文档时，我在它的底部发现了以下内容：

“要轻松访问基于特定容器的查询，请参阅 Ext.container.container.query、Ext.container.container.down和 Ext.container.container.child方法。另请参见Ext.Component.up。“

因此Ext.container.ContainerView（xtype:container）实现了子元素（[selector]），它回答与选择器字符串参数匹配的第一个子元素

---

它正是我想要的。

你可以只做组件。query（'selector'）查询从组件开始的子树。

你可以只做组件。query（'selector'）查询从组件开始的子树。

是的，我混合了控制器和视图，我有一个MVC（实际上是MVP）过去和那里的控制器和视图总是在一起。我理解ComponentQuery选择器语法中的“>”运算符，但这不起作用，因为它是全局的，而且我事先不知道子项的深度（想想动态生成的GUI）。在我的视图合成中，我可以使用选择器（S）和容器（C），它们的合成方式如下：ViewPort（S，C（S，C（S，C，C（…））））。如果您不知道深度，那么您只需使用“ViewPort mycontainer[property=value]”，但如果我不知道哪个属性不同呢？我不想标记每一个实例，这个选择器+容器对应该只知道它自己，并且能够嵌入（其他任何事物的子对象）任何其他事物，并且可以根据需要进行深入。这是我从一开始就在Smalltalk中使用的一种常见的MVC/MVP模式，只是我不知道如何在ExtJS4中使用相同的模式，但我下面的答案就是我想要的。是的，我混合了控制器和视图，我有一个MVC（实际上是MVP），并且这些控制器和视图总是一起出现。我理解ComponentQuery选择器语法中的“>”运算符，但这不起作用，因为它是全局的，而且我事先不知道子项的深度（想想动态生成的GUI）。在我的视图合成中，我可以使用选择器（S）和容器（C），它们的合成方式如下：ViewPort（S，C（S，C（S，C，C（…））））。如果您不知道深度，那么您只需使用“ViewPort mycontainer[property=value]”，但如果我不知道哪个属性不同呢？我不想标记每一个实例，这个选择器+容器对应该只知道它自己，并且能够嵌入（其他任何事物的子对象）任何其他事物，并且可以根据需要进行深入。这是我从一开始就在Smalltalk中使用的一种常见的MVC/MVP模式，只是我不知道如何在ExtJS4中使用相同的模式，但我下面的答案就是我想要的

Ext.define('MyApp.controller.explorer.Base', {
    extend: 'Ext.app.Controller',
    refs: [
        {ref: 'explorerContainer', selector: '[itemId="explorerContainer]'},
        {ref: 'explorerSelector', selector: '[itemId="explorerSelector]'}
    ],