Extjs

Question

我定义了一个xtype：

Ext.define('Sample.view.CustomTextfield', {
  extend: 'Ext.field.Text',
  customConfig: 'foo'
  . . . .
});

我现在想知道是否有使用 customConfig 创建组件的方法。

做类似myPanel.add(Ext.getComponentByConfig('customConfig', 'foo'));

的事情

是否有 extjs 可以这样做？

注意：

自定义组件尚未呈现但已定义，因此使用 ComponentQuery 等（.up()、.down() 等）的答案是不正确的。

编辑:

这是一个示例用例：

假设你有一个对象键值对数组：

var myArray = [
  { config: 'customConfig', value: 'foo' },
  { config: 'anotherCustomConfig', value: 'bar' },
  . . . .
]

现在，我需要做的是遍历数组并检索 config 属性，然后我将使用它来检索具有等于 [ 的配置的 xtype =18=]，即配置 customConfig 的值为 foo。简而言之，我想使用 config->value 对象数组动态呈现视图。

Answer 1

如果您的 objective 是将自定义组件添加到面板，您可以在 Ext.define 中使用别名属性并使用小部件名称来添加它。

 Ext.define('Sample.view.CustomTextfield', {
  extend: 'Ext.field.Text',
  alias: 'widget.foo'
  . . . .
});

在 myPanel 中，添加此组件，例如，

myPanel.add({ xtype :'foo',});

Answer 2

所以，这就是我的想法。我不知道这是否是正确的方法，但无论如何我都会分享。请随时改进：

Ext.createBy = function (config, value) {
    var classes = Ext.ClassManager.classes;
    for (var cls in classes) {
        if (classes.hasOwnProperty(cls)) {
            var c = classes[cls];
            if ((c[config] && c[config] === value) || (c.prototype && c.prototype[config] && c.prototype[config] === value)) {
                return Ext.create(classes[cls].getName());
            }
        }
    }
}

这个函数 Ext.createBy 所做的是遍历 Ext.ClassManager 持有的 classes 并检查 class 是否有 config和参数中提供的值。然后它使用通过测试的 Ext.create 调用

可以这样使用：

myPanel.add(Ext.createBy('someConfig', 'someValue'));

或者，关于我的示例用例：

var myArray = [
  { config: 'customConfig', value: 'foo' },
  { config: 'anotherCustomConfig', value: 'bar' },
  . . . .
];

for (var i = 0, l = myArray.length; i < l; i++) {
   var obj = myArray[i];
   myPanel.add(Ext.createBy(obj.config, obj.value);
}

这将根据 config->value 将项目动态添加到 myPanel。

Extjs - 使用自定义配置检索 xtype

Extjs - Retrieve xtype using custom config

extjs4

extjs4.2