Question

Ext JS：ver 6.5.2.463 theme-classic（6.2.1.167）浏览器：Chrome版本62.0.3202.94（64位）操作系统：窗口10（64位）

几天前我像往常一样开始我的应用程序，但是当我在Chrome中打开已经折叠的面板时，遇到了一个尴尬的行为，它的标题栏文本是空白的。我在另一个浏览器上试过它在那里工作得很好。我在另一台机器上尝试过它在那里工作得很好。但当其他机器的Chrome更新时，同样的问题也存在。我们将Ext JS版本从6.2.1.167（Classic）更新到6.5.2.463（经典版），但问题仍然存在。我们在小提琴上创建了类似的UI，并附加了链接。所以你可以验证它。 https://fiddle.sencha.com/#fiddle/2acg&view/editor 还有其他人面临同样的问题吗？要重现此问题： 1.打开小提琴的链接。 2.单击展开按钮，将显示标题栏内容。 3.现在点击折叠然后展开现在内容将消失。

还附上了屏幕截图。 title bar is blank there

Answer 1

您需要使用此配置 collapseMode 以及collapseMode的代码文件。

在 FIDDLE 中，我使用了您的代码并根据您的要求进行了一些更改。希望这能帮助您或指导您解决问题。

Ext.create('Ext.panel.Panel', {
    plugins: 'viewport',
    title: 'ViewPort Title',
    layout: 'fit',
    tbar: [{
        xtype: 'button',
        text: 'Expand',
        handler: function () {
            var panel = this.up('panel').down('#bottomPanel');
            panel.collapseMode = undefined;
            panel.expand();
        }
    }, {
        xtype: 'button',
        text: 'Collapse',
        handler: function () {
            this.up('panel').down('#bottomPanel').collapse();
        }
    }],
    items: [{
        xtype: 'container',
        layout: 'border',
        items: [{
            xtype: 'panel',
            title: 'Center Panel Title',
            region: 'center',
            html: 'Sample center panel text'
        }, {
            xtype: 'panel',
            itemId: 'bottomPanel',
            title: 'Bottom Panel Title',
            region: 'south',
            height: 150,
            collapsible: true,
            collapseMode: 'mini',
            collapsed: true,
            layout: 'fit',
            items: [{
                xtype: 'panel',
                html: 'Sample bottom inner panel text'
            }]
        }]
    }]
});

标题栏内容在chrome中变为空白/不可见

1 个答案: