Question

我在ExtJs工具栏中有四个按钮，这个按钮代码如下所示

MyToolbarUi = Ext.extend(Ext.Toolbar, {
    buttonAlign: 'right',
    width: 813,
    height: 32,
    id: 'toolbar',
    initComponent: function() {
        this.items = [
            {
                xtype: 'buttongroup',
                title: '',
                columns: 2,
                width: 250,
                layout: 'column',
                baseCls: ' ',
                id: 'buttongroup',
                items: [
                    {
                        xtype: 'button',
                        text: ' B1',
                        width: 50,
                        ref: '../b1',
                        id: 'b1_id'
                    },
                    {
                        xtype: 'button',
                        text: 'B2',
                        width: 50,
                        ref: '../b2',
                        id: 'b2_id'
                    },
                    {
                        xtype: 'button',
                        text: 'B3',
                        width: 50,
                        ref: '../b3',
                        id: 'b3_id'
                    },
                    {
                        xtype: 'button',
                        text: 'B4',
                        width: 50,
                        ref: '../b4',
                        id: 'b4_id'
                    }
                ]
            }
        ];
        MyToolbarUi.superclass.initComponent.call(this);
    }
});

在上面的代码我有4个按钮调用b1，b2，b3和b4现在我尝试以编程方式隐藏b4代码

第一次尝试：this.b4.hidden = true;

第二次尝试：var btn= Ext.getCmp('b4_id'); btn.setVisible(false);

以上两种方式都隐藏了所有4个按钮。我怎样才能以编程方式隐藏B4按钮？请解释我上面隐藏的两种方式有什么问题？

Answer 1

尝试使用Ext.get，一旦我遇到同样的问题，我通过用Ext.get替换Ext.getCmp解决

尝试

 btn= Ext.get('b4_id'); 
 btn.setVisible(false); 

or 

btn.hide();

如果你想最初隐藏，请使用如下配置。

hidden: true

由于

如何以编程方式隐藏ExtJS.Toolbar按钮（在buttongroup内）

1 个答案: