如何在按钮单击时更改卡布局内的面板 - extjs 4

Question

我有此要求在按钮点击时更改面板内的活动项目（卡片布局）。该按钮出现在另一个不同的面板中。我尝试了以下但它不起作用。单击按钮时，面板不会更改。

Ext.getCmp（ 'PanelID'）layout.setActiveItem（ 'requiredcardID'）; - 我在按钮处理程序中使用此代码。

setActiveItem是不正确的方法还是我在错误的上下文中使用它？

Answer 1

这看起来是正确的语法 - 可能会检查您的ID以确保您获得对该组件的引用？这个小提琴使用5，但我也测试了4：

https://fiddle.sencha.com/fiddle/ba6/

Ext.application({
    name : 'Fiddle',

    launch : function() {
        var panel = Ext.create('Ext.Panel',{
            renderTo:Ext.getBody(),
            title:'myPanel',
            items: [
                Ext.create('Ext.panel.Panel', {
                    layout: 'card',
                    id: 'PanelID',
                    activeItem: 0,
                    items: [Ext.create('Ext.panel.Panel', {
                        itemId: 'card-1',
                        html: 'hello'
                        }), 
                        Ext.create('Ext.panel.Panel', {
                            itemId: 'card-2',
                            html: 'hello2'
                        })]
                }),
                Ext.create('Ext.Button', {
                    text: 'change item in layout',
                    handler: function() {
                        Ext.getCmp('PanelID').layout.setActiveItem('card-2');               
                    }
                })
            ]
        });
    }
});