如何在渲染时将面板置于面板中心

Question

我有一个简单的场景，其中一个面板在加载内容时需要一个蒙面加载指示器。我使用以下代码使掩码正常工作，但第一次调用时，加载指示符出现在顶部。在显示面板后调用它，即。在按钮事件中，蒙版正确显示在面板的中央。有什么想法吗？

var pnl = new Ext.Panel({
    title: 'test',
    width: 500,
    height: 500,
    renderTo: 'controls',
    listeners: {
        render: function(comp) {
            comp.load();
        }
    },
    load: function() {
       this.el.mask('loading...', 'loadingMask');
    }
});

Answer 1

在完全渲染html之前，看起来掩码已应用于面板。一个简单的解决方案是在应用之前不久延迟掩模。

render: function(comp) {
    setTimeout(function() { comp.loadPermissions(); }, 100);
}

Answer 2

也可以从'render'监听器调用this.el.mask（）。在this.load方法中调用掩码之前，还要检查this.rendered属性。