Вкладка. Панели внутри вкладки. Панель?

Question

Я пишу простое приложение с вкладкой «Главная», в которой должно быть 3 вкладки «Завтрак», «Обед» и «Ужин». Однако вкладки не работают внутри дома. Они отображаются, но не реагируют на клики.

Код:

вид/Main.js

Ext.define('MyApp.view.Main', { 
extend: 'Ext.tab.Panel', 
requires: ['Ext.TitleBar'], 
xtype: 'main', 
config: { 
    tabBarPosition: 'bottom', 
    items: [ 
     { 
      xtype: 'menu', 
     } 
    ] 
} 

});

вид/Menu.js

Ext.define('MyApp.view.Menu', { 
extend: 'Ext.tab.Panel', 
requires: ['Ext.TitleBar'], 
xtype: 'menu', 
config: { 
    title: 'Menu', 
    iconCls: 'home', 
    tabBar: { 
     layout: { 
      pack: 'center' 
     } 
    }, 
    items: [ 
     { 
      title: 'Breakfast', 
      items: { 
       docked: 'top', 
       xtype: 'titlebar', 
       title: 'Breakfast Menu' 
      }, 

      html: [ 
       "Breakfast menu will be here" 
      ].join("") 
     }, 
     { 
      title: 'Lunch', 


      items: { 
       docked: 'top', 
       xtype: 'titlebar', 
       title: 'Lunch Menu' 
      } 

      html: [ 
       "Lunch menu will be here" 
      ].join("") 
     }, 
     { 
      title: 'Dinner', 

      items: { 
       docked: 'top', 
       xtype: 'titlebar', 
       title: 'Dinner Menu' 
      }, 

      html: [ 
       "Dinner menu will be here" 
      ].join("") 
     }, 
    ] 
} 

})

Answer 1

Исправлена ​​проблема ... Видимо именования xtype: 'Меню' вызвало проблемы. Не называйте свой xtype универсальными именами!