Javascript 如何将工具栏添加到视口？

我试图将工具栏添加到视口中，但当尝试使用下面的代码完成此操作时，它根本不会出现（只显示选项卡面板）

Ext.define（CONFIG.APP_NS+'.view.Viewport'{
扩展：“Ext.container.Viewport”，
布局：{
类型：“边框”
},
this.dockditems=[
{
xtype:'maintoolbar'
}
],
此项。项目=[
{
地区：'中心'，
xtype:“maintabpanel”
}
];
});
//主工具栏
Ext.define（CONFIG.APP_NS+'.view.MainToolbar'{
扩展：“Ext.toolbar.toolbar”，
别名：“widget.maintoolbar”，
initComponent:函数（）{
此项。项目=[
// 
]
}
});

我知道我可以将其添加到north region，但随后它显示为border，而

border:false

不起任何作用

我做错了什么？

An没有名为

dockditems

的属性，只有

Ext.panel.panel

具有该属性。这就是为什么工具栏没有显示，它被完全忽略，因为视口不知道如何处理

dockditems

我会像你建议的那样把工具栏放在北部地区

---

border:false

config目前在工具栏中不起作用，这是一个已知的bug。也许值得在Sencha论坛上发布一篇帮助文章，您可以从ExtJS团队那里获得一些帮助。

Oh。。这是有道理的。谢谢，我想我会用CSS删除工具栏的边框。

Ext.define(CONFIG.APP_NS+'.view.Viewport', {
    extend: 'Ext.container.Viewport',
    layout: {
        type: 'border'
    },
    this.dockedItems = [
        {
            xtype: 'maintoolbar'
        }
    ],
    this.items = [
        {
            region: 'center',
            xtype: 'maintabpanel'
        }
    ];
});

// MainToolbar
Ext.define(CONFIG.APP_NS+'.view.MainToolbar', {
    extend: 'Ext.toolbar.Toolbar',
    alias: 'widget.maintoolbar',

    initComponent: function () {
        this.items = [
            // <...>
        ]
    }
});