Extjs Sencha Touch 2选项卡面板：其他选项卡中的内容位于错误位置

我正在学习Sencha Touch 2，我被一个选项卡面板问题弄糊涂了

这就是我定义我的观点的方式

Ext.define('NewApp.view.Main', {
extend: 'Ext.tab.Panel',
config: {
    activeItem: 1,
    items: 
    [{
        title: 'info',
        iconCls: 'info',
        items: 
        [{
            xtype: 'button',
            text: 'button1',
        }]
    },
    {
        title: 'more',
        iconCls: 'more'
    }]
}

}))

在app.js中：

Ext.application({
name: 'NewApp',

requires: [
    'Ext.tab.Panel',
    'Ext.Button'
],

views: [
    'Main'
],

launch: function() {
    Ext.Viewport.add(Ext.create('NewApp.view.Main'));
},

}))

这很简单。在一个名为“信息”的选项卡上有一个按钮，而在另一个选项卡“更多”上没有任何按钮。activeItem设置为1，以确保标题为“更多”的选项卡将首先显示。 然而，当我启动应用程序时，我发现输出与预期不同

按钮应该显示在第一个选项卡上，现在不仅显示在第一个选项卡上，还显示在第二个选项卡上。但是，当我滑到“信息”选项卡并滑回“更多”选项卡时，按钮不见了

---

有人能告诉我，在第一个场景中，我应该如何去掉第二个选项卡上的按钮吗？

尽量不要在列表中设置activeItem

在启动方法中添加以下行：

Ext.Viewport.down('.tabpanel').setActiveItem(1);

---

它就是这样工作的。

我曾经因为“停靠”属性而遇到过类似的问题

尝试设置tabbar docker机器人或更改布局配置

---

ST对那些定义不正确的属性不太友好。

您是否需要进一步的帮助，或者其中一个答案是否回答了您的问题？