Extjs 如何获取组件对象？

我的观点是：

Ext.define('Demo.example.OpenRequest', {
    extend: 'Ext.draw.Component',
    xtype: 'demo',
    height: 280,
    width: 1213,
    viewBox: false,
    listeners: {
        'beforerender': function (panel) {
            alert("Hi");
            alert(panel.param);
            alert(panel);
            var itemArray = panel.items;
            itemArray.forEach(function (i) {
                if (i.itemId == 'green-rect') {
                    i.addCls('x-hide-display');
                }
            });
        }
    },
    constructor: function (config) {
        this.items = [{
                type: "image",
                src: 'http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/64/green-user-icon.png',
                width: 100,
                height: 100,
                translate: {
                    x: 10,
                    y: 80
                }
            },
            {
                type: 'rect',
                itemId: 'green-rect',
                width: 200,
                height: 50,
                radius: 10,
                fill: 'green',
                opacity: 0.5,
                stroke: 'black',
                'stroke-width': 2,
                translate: {
                    x: 400,
                    y: 110
                },
                listeners: {
                    click: function (as) {
                        alert('A');
                    }
                }
            },
            {
                type: 'rect',
                width: 200,
                height: 50,
                radius: 10,
                itemId: 'red1-rect',
                fill: 'red',
                opacity: 0.5,
                stroke: 'black',
                'stroke-width': 2,
                translate: {
                    x: 890,
                    y: 10
                },
                listeners: {
                    click: function () {
                        alert('B');
                    }
                }
            }];

        if (this.items) {
            Ext.apply(config, {
                items: this.items
            });
        }
        this.callParent([config]);
    }
});  

在beforerender侦听器中，我希望根据值隐藏绿色矩形。我正在检查I.itemId=='green rec'是否添加了一个具有隐藏属性的类。但我发现它作为未定义的函数给出了错误。 我该如何隐藏它

css:

我在中测试了您的代码，当您希望真正的项目在您需要的panel.items.items上运行时。 下面的代码应该可以工作

var itemArray = panel.items.items; //now you have the items you want to iterrate over
Ext.Object.each(itemArray, function (key, value) {
    if (value.itemId == 'green-rect') {
        value.addCls('x-hide-display');
    }
});

panel.items的类型为，因此您可以只执行以下操作

var itemArray = panel.items;
itemArray.each(function (item) {
    if (item.itemId == 'green-rect') {
        item.addCls('x-hide-display');
    }
});

---

现在请尝试此解决方案，它可以工作，但我不喜欢基于Ext id的元素查询：-

var drawComponent = Ext.create('Ext.draw.Component', {
viewBox: false,
items: [{
    type: 'circle',
    fill: '#79BB3F',
    id: 'green-rect',
    itemId:'green-rect',
    radius: 100,
    x: 100,
    y: 100
}],
listeners: {
    'afterrender': function(panel) {
        alert("Hi");
        alert(panel.param);
        alert(panel);
        var itemArray = panel.items;
        //debugger;
        Ext.getElementById('green-rect').style.display = 'none';
    }
}

})

}.表演

尝试了发布的其他解决方案，但不起作用，因为即使afterrender子项也不是Ext组件，而只是一个配置

items对象中没有hide或addClass或任何其他Ext.Component方法

您可以执行以下操作：

if (var obj = itemArray.find('itemId', 'green-rect')) {
    obj.addCls('x-hide-display'); 
}

编辑：

此对象没有addCls方法。应使用隐藏方法隐藏矩形：

if (var obj = itemArray.find('itemId', 'green-rect')) {
    obj.hide(); 
}

---

错误：undefined不是一个函数。我想检查Ext.data.sprite.Rect的alerti instanceof Ext.data.sprite.Rect类型，它告诉我rec没有定义。我是Ext.draw.sprite.Rect的对象吗？有没有其他检查对象类型的方法？使用修改后的代码后，它会以未捕获类型错误的形式给出错误：undefined不是一个函数我认为当addCls出现在图片中时会发生此错误我认为不是进入.eachfunction{}作为中间使用的警报不会出现此视图正被其他几个视图调用。因此，按Id查询将给出重复的Id errorNope！！它说undefined不是一个函数是的，我看了文档-这个对象没有addCls方法。如何改为使用.hide方法？javascript在itemArray中给出错误。find'itemId'，'green-rect'表示undefined不是函数如果您尝试：itemArray.get1.hide

if (var obj = itemArray.find('itemId', 'green-rect')) {
    obj.addCls('x-hide-display'); 
}

if (var obj = itemArray.find('itemId', 'green-rect')) {
    obj.hide(); 
}