ExtJS-xtype“面包屑”:更改选择框和面包屑文本列表中的项目和样式

时间:2018-10-19 13:54:14

标签: extjs breadcrumbs

我有一个目录(文件夹)结构,该结构以xtype“ breadcrumb”(ExtJS版本6.6)显示。

现在,我将在我的应用程序中添加一个附加切换。当我激活切换开关时,所有文件夹都应显示在面包屑文本列表和选择框中。这是我的实际发展状况,可以正常工作。

当我停用切换开关时,所有在文件夹名称中带有“ A”开头的文件夹都应隐藏在选择框中(或应禁用并以灰色显示)。在面包屑文本列表中,此(“ A”-)文件夹应显示为灰色。

例如,我的应用程序中有面包屑文本列表“ root> folder_0_0> folder_1_0”,然后更改切换值:然后,我不想重新加载完整的面包屑。

如何解决此问题?谢谢您的提示托马斯

这是我的代码。您可以找到以下内容:https://fiddle.sencha.com/#view/editor&fiddle/2mqb

    Ext.application({
        name: 'BeadcrumbTest',
        launch: function() {
            var store = Ext.create('Ext.data.TreeStore', {
                root: {
                expanded: true,
                    text: 'Root_folder',
                    children: [{
                        text: 'A_folder',
                        leaf: true
                    }, {
                        text: 'B_folder',
                        expanded: true,
                        children: [{
                            text: 'A_folder',
                            leaf: true
                        }, {
                            text: 'B_folder',
                            leaf: true
                        }]
                    }, {
                        text: 'C_folder',
                        leaf: true
                    }]
                }
            }),
                panel = Ext.create('Ext.panel.Panel', {
                    renderTo: Ext.getBody(),
                    width: 400,
                    height: 100,
                    bodyPadding: 10,
                    tbar: {
                        xtype: 'breadcrumb',
                        store: store
                    },
                    buttons: ['->', {
                        xtype: 'button',
                        text: 'Handle "A" folder',
                        handler: function() {
                          // todo
                        }
                    }]
                });
        }
    });

1 个答案:

答案 0 :(得分:0)

我找到了一个解决方案:我覆盖了classic / src / Breadcrumb.js中的方法updateSelection(),_ onMenuClick()和_onMenuBeforeShow()。