Css 在extjs选项卡面板中添加徽标

我已经使用Extjs创建了一个选项卡面板

Ext.define('tabPanel.view.MyTabPanel', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.mytabpanel',

    requires: [
        'tabPanel.view.MyTabPanelViewModel',
        'Ext.Toolbar',
        'Ext.Img'
    ],

    viewModel: {
        type: 'mytabpanel'
    },
    activeItem: 1,

    items: [
        {
            xtype: 'toolbar',
            docked: 'top',
            title: '',
            layout: {
                type: 'hbox',
                align: 'start',
                pack: 'center'
            },
            items: [
                {
                    xtype: 'image',
                    height: 78,
                    width: 101,
                    src: 'https://www.gravatar.com/avatar/46c7c14743be3064db03681e16e55fd3?s=48&d=identicon&r=PG&f=1'
                }
            ]
        },
        {
            xtype: 'container',
            title: 'Tab 1'
        },
        {
            xtype: 'container',
            title: 'Tab 2'
        },
        {
            xtype: 'container',
            title: 'Tab 3'
        }
    ]

});

---

我试图将面板标题作为我的站点标题。我试图在选项卡按钮前添加徽标。但这条路线并没有像预期的那样起作用。是否可以在左侧设置徽标，并在徽标后设置选项卡按钮。有可能吗？

不知道这是否正确，或者这是否是您期望的结果，但我的解决方案是使用选项卡面板中的

选项卡栏

配置添加徽标，在创建组件后，我添加我想要的其他选项卡

tabBar: {
    items: [{
        xtype: 'image',
        height: 78,
        width: 101,
        src: 'https://www.gravatar.com/avatar/46c7c14743be3064db03681e16e55fd3?s=48&d=identicon&r=PG&f=1'
    }]
},
listeners: {
    beforerender: function (cmp) {
        cmp.insert(1, [{
            xtype: 'container',
            title: 'Tab 1',
        }, {
            xtype: 'container',
            title: 'Tab 2'
        }, {
            xtype: 'container',
            title: 'Tab 3'
        }])
    }
}

我必须在创建组件后添加其他面板，因为默认情况下，tabbar项添加在tabpanel项之后，在创建组件后添加它们，徽标将位于其他面板的左侧

---

签出

不知道这是否正确，或者这是否是您期望的结果，但我的解决方案是使用选项卡面板中的

选项卡栏

配置添加徽标，在创建组件后，我添加我想要的其他选项卡

tabBar: {
    items: [{
        xtype: 'image',
        height: 78,
        width: 101,
        src: 'https://www.gravatar.com/avatar/46c7c14743be3064db03681e16e55fd3?s=48&d=identicon&r=PG&f=1'
    }]
},
listeners: {
    beforerender: function (cmp) {
        cmp.insert(1, [{
            xtype: 'container',
            title: 'Tab 1',
        }, {
            xtype: 'container',
            title: 'Tab 2'
        }, {
            xtype: 'container',
            title: 'Tab 3'
        }])
    }
}

我必须在创建组件后添加其他面板，因为默认情况下，tabbar项添加在tabpanel项之后，在创建组件后添加它们，徽标将位于其他面板的左侧

结帐