1

我做了一个常见的视图，所有页面都需要这个视图。因此，无论我需要什么，我都将这种视图称为 xtype 。在这个通用视图中有一些由 id 值定义的组件。

根据要求取决于页面，我需要从常见视图中隐藏一些按钮再次需要显示。这些活动将取决于页面。虽然第一个启动时间屏幕会出现。一旦我导航到另一个页面，它将显示 Ext.AbstractManager.register(): Registering duplicate id "btnLogout" with this manager 之类的错误。

如果我将组件 id 值更改为名称值或 itemId 值。然后它会很好地导航，但问题是无法隐藏和显示按钮，因为显示未定义的 sysntax 是 var a = Ext.getCmp('btnBackID'); console.log(a);，它将是未定义的。一旦组件作为对象返回，我就可以隐藏显示功能。

谁能告诉我如何解决这个问题，否则给我替代方法来实现。非常感谢。谢谢你。我在下面给出了我的代码

共同观点

Ext.define('abc.view.GlobalNavigationView', {
    extend:'Ext.panel.Panel',
    alias:'widget.globalNavigationView',
    id:'globalNavigationId',
     layout: {
         type: 'vbox',
         align:'stretch'
     },
    items:
        [
            {
                xtype: 'toolbar',
                layout: 'hbox',
                flex: 1,
                items:
                    [
                        {
                            xtype: 'button',
                            flex: .1,
                            text: 'Back',
                            id: 'btnBackID',                    
                        },                        

                        {
                            xtype: 'button',
                            flex:.1,
                            id: 'btnSave',
                            cls: 'saveCls'
                        },
                        {
                            xtype: 'button',
                            flex:.1,
                            id: 'btnEmail',
                            text: 'Email'
                        },
                        {
                            xtype: 'button',
                            flex:.1,
                            id: 'btnPrint',
                            text: 'Print'
                        },
                        {
                            xtype: 'button',
                            flex:.1,
                            itemId: 'btnFilter',
                            text: 'Filter'
                        },
                        {
                            xtype: 'button',
                            flex:.1,
                            id: 'btnLogout',
                            cls: 'logoutCls'
                        }
                    ]
            }

        ]
});

主页查看1

Ext.define('GulfMark.view.WeeklyHomeView1', {
     extend:'Ext.panel.Panel',
     alias:'widget.weeklyfcastView',
     id:'weeklyfcastId',
        layout: 'fit',
        items:
        [
           {
                xtype: 'globalNavigationView',
                id: 'globalNavigationWeekly1',
                flex: 1,
                docked:"top",
                scrollable:false
            },
            {
                my componets of this view
                .........................
            }

        ]
});

主页查看2

Ext.define('GulfMark.view.WeeklyHomeView1', {
     extend:'Ext.panel.Panel',
     alias:'widget.weeklyfcastView',
     id:'weeklyfcastId',
        layout: 'fit',
        items:
        [
           {
                xtype: 'globalNavigationView',
                id: 'globalNavigationWeekly2',
                flex: 1,
                docked:"top",
                scrollable:false
            },
            {
               my componets of this view
                -----------------------
            }

        ]
});

控制器代码：

  init:function(){

        this.control({
            'globalNavigationView ':{
                click:this.onbtnBackClick,
                render: this.onbtnBackrender,
            },            
            'weeklyfcastView':{
                show:this.onShowweeklyfcastView,
                render:this.onRenderweeklyfcastView
            }
        });
    },

   onShowweeklyfcastView: function(){       

        var btnFilter = Ext.getCmp('btnFilter');
        console.log(btnFilter); // if i used components id to name or itemId, here will show undefined
        btnFilter.setHidden(true);  
        //btnFilter .hide();

    }
4

2 回答 2

2

如果您的视图不是单例，则不能为其组件提供 ID - ID 必须是唯一的，否则您会收到duplicate id错误消息。

您真正需要的是对您尝试显示/隐藏按钮的视图的一些参考。当你有那个参考时，你可以使用down方法来找到你的按钮。例如：

var iPanel = // Create new panel here.
iPanel.down('button[text="Email"]').hide();
于 2013-03-26T23:34:59.417 回答
0

此代码在 EXTJS 6 中适用于同一视图中的多个按钮，具有相同的itemId（不是 id - ids 将引发错误，如上所述）

看法：

            {
                xtype : 'button',
                text : 'Save and Come Back Button 1',
                itemId : 'saveAndComeBackButton',
                handler : 'saveAndComeBack'
            },
            {
                xtype : 'button',
                text : 'Save and Come Back Button 2',
                itemId : 'saveAndComeBackButton',
                handler : 'saveAndComeBack'
            },

控制器：

this.__setButtons('#saveAndComeBackButton','disable');


__setButtons: function (buttonItemId,state) {

    Ext.Array.forEach(
        Ext.ComponentQuery.query(buttonItemId),
        function (button){
            if (state === 'enable'){
                button.enable();
            }else{
                button.disable();
            }
        }
    );

}
于 2016-05-17T21:46:37.020 回答