ExtJs通过以某个字符串开头的id选择组件

Question

我需要通过按钮点击动态创建一个组件。我的限制是：

1. 它将具有以固定字符串“myComp_”开头并后跟随一个随机数的ID
2. 任何时候只会有一个以“myComp_xxx”开头的组件

因此，在创建组件之前，我必须检查是否有任何已创建的组件，并将其删除... 我的问题从这里开始。Ext.getCmp()想要特定的ID。但是我只有那个固定的字符串：myComp_...

有没有办法获取之前创建的组件？

提前感谢您的帮助，并对我的英语表示抱歉。

- DonkeyKong

Answer 1

对于 ExtJs 4.X，请使用 Ext.ComponentQuery.query('*[id^=myComp_xxx]');

对于 ExtJs 3.X，您可以使用以下方法之一

var el = Ext.query('*[id^=myComp_xxx]');
var cmp = Ext.getCmp(el.id);

或者（我个人没有尝试过，但我认为它应该有效）如果组件是可以访问的父组件的子级，则：

var el = parentComp.find("action","btn");

并在按钮配置中设置一个名为 action : btn的属性。

- Varun Achar

Answer 2

我认为你正在寻找的是DomQuery。

例如：

Ext.query("*[id^=myComp_xxx]")

- Arun P Johny

---

我尝试过，但这给了我DOM元素，而不是组件。我能从这里得到组件吗？ - DonkeyKong

我认为 Ext.get(dom_element) 将会给你这个组件。 - Arun P Johny

实际上不是。Ext.get() 返回的是 DOM 元素。 - MarthyM

Answer 3

听起来你应该使用普通的组件查询方式——通常不建议使用id。你可以通过xtype和itemId（手动分配）进行查询。

以下是：

Ext.ComponentQuery.query('grid form');  

我会找到所有包含表单的xtype为grid的元素。

Ext.ComponentQuery.query('grid #okButton');  

这里的“#”表示查找具有itemId“okButton”的网格。您可以嵌套到任何级别并使用其他运算符来更加具体化，正如其他人所指出的那样，您可以使用组件上下文进行相对定位。值得注意的是，使用up和down时只返回第一个结果数组而不是全部结果。有关详细信息，请参见文档。此外，请参见避免的错误实践清单中的第6点以了解更多原因。

- JonnyRaa

Answer 4

You need to use this: Ext.getCmp(id)

Ext.getCmp("myComp_xxx");

- Johan Haest

---

我相信我在问题上表述不够清楚。那个“xxx”的部分是未知的。它是一个随机数。 - DonkeyKong

但是，如果组件只显示一次，为什么不直接给它一个随机ID呢？您没有义务让ExtJS处理ID生成。 - Johan Haest

你是在告诉我应该去掉随机部分并创建具有特定ID的组件吗？ - DonkeyKong

是的，那确实是我想告诉你的。或者你可以填写另一个属性并查询你的组件。如果它在面板内，你可以像这样查询：panel.down('field[name=myName]'); - Johan Haest

Answer 5

如果您知道组件将被创建的位置，另一种选择是使用up()/down()方法。

例如，如果您有一个按钮并希望在单击处理程序中获取其所包含的表单，可以执行以下操作：

function myClickHandler(btn) {
     var form = btn.up('form');

     //do something with form 
}

- dougajmcdonald