javascript - ExtJS 4 : Window not sizing correctly on first show

Question

我不明白为什么这段代码第一次运行:

var mypopup = Ext4.create('Suidgets.NSConfirmationBox', {
    title: 'Delete',
    message: 'Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>Do you want to delete this row? Do you want to delete this row? Do you want to delete this row?<br>',
    id: 'mypopup',
    listeners: {
        afterrender: function() {
            this.doComponentLayout();
        }
    }
});

mypopup.show();

它输出:

但是一旦你关闭它并且下次运行它时，它就会完美地呈现窗口大小:

这是小部件的代码: https://jsfiddle.net/ardimaunahan/63ofm68o/

我尝试了几个事件来触发doComponentLayout但仍然不会生效:show、beforeshow、activate。但是，如果您通过浏览器控制台执行此操作，它会完美调整:

Ext4.getCmp('mypopup').doComponentLayout();

有人能告诉我为什么会这样吗？谢谢!

更新 1:我检查了生成的 HTML 的差异，它在主窗口的高度和宽度上有所不同:

我想知道 Ext.window.Window 中是否有任何配置可以用来修复此尺寸错误。

更新 2:这是一个完全有效的 fiddle :https://jsfiddle.net/ardimaunahan/hcg4p3v4 。必须在浏览器上按 Ctrl + F5 才能看到损坏的弹出布局。您还需要按 Esc 键关闭弹出窗口。在 Firefox/Chrome 中，成功单击“显示弹出按钮”可以使布局正常，但在 IE 中仍然损坏。

Answer 1

我担心您必须重写盒子的 show() 函数。

以下似乎对我有用:

show:function() {
    this.callParent(arguments);
    this.doComponentLayout();
}

我不确定这是否可以跨浏览器，请在使用前检查。