Как нужно реализовать выпадающий список из панели вкладок Ext JS 6?

Question

Мне нужно реализовать выпадающий список из панели вкладок, подобный этому

Кто-нибудь сталкивался с чем-то подобным?

Я пытался использовать древовидный список, но, на мой взгляд, он не очень подходит в этом случае.

Answer 1

Пожалуйста, взгляните на Ext.menu.Menu в документах sencha:

Вы можете сделать что-то вроде этого

{
        xtype: 'button',
        text: 'MyButton',
        menu: {
            xtype: 'menu',
            width: 120,
            items: [
                {
                    xtype: 'menuitem',
                    text: 'Menu Item',
                    menu: {
                        xtype: 'menu',
                        width: 120,
                        items: [
                            {
                                xtype: 'menuitem',
                                text: 'Menu Item'
                            },
                            {
                                xtype: 'menuitem',
                                text: 'Menu Item'
                            },
                            {
                                xtype: 'menuitem',
                                text: 'Menu Item',
                                menu: {
                                    xtype: 'menu',
                                    width: 120,
                                    items: [
                                        {
                                            xtype: 'menuitem',
                                            text: 'Menu Item'
                                        },
                                        {
                                            xtype: 'menuitem',
                                            text: 'Menu Item'
                                        },
                                        {
                                            xtype: 'menuitem',
                                            text: 'Menu Item'
                                        }
                                    ]
                                }
                            }
                        ]
                    }
                },
                {
                    xtype: 'menuitem',
                    text: 'Menu Item'
                },
                {
                    xtype: 'menuitem',
                    text: 'Menu Item'
                }
            ]
        }
    }