Question

我尝试在用户等待显示面板时显示加载掩码。

我使用Ext.LoadMask，如：

loadingMask = new Ext.LoadMask(Ext.getBody(), {msg:"Loading..."});

loadingMask.show();
panel = new MyPanel();
panel .show();

并在小组的后续工作中

this.listeners = {
        afterrender: function () {
        loadingMask.hide();
        }
}

但是在面板出现之前没有显示加载蒙版，当我关闭面板时，我看到加载蒙版。

我认为这意味着我的加载蒙版在后台运行，所以我看不到它。

您是否知道此问题的解决方案？这似乎是我认为的一个层问题。

如何将加载蒙版显示在顶部并在面板中显示后隐藏它？

谢谢。

Answer 1

我认为你正在寻找这样的东西：

 Ext.onReady(function(){
            var loadingMask = new Ext.LoadMask(Ext.getBody(), {
                msg: "Loading..."
            });

            loadingMask.show();
            var panel = new Ext.Panel({
                renderTo: 'div1',
                width: 100,
                height: 100,
                title: 'MyPanel',
                listeners: {
                    afterrender: function(){
                        loadingMask.hide();
                    }
                }
            });         

        });

我已经包含了renderTo配置选项，告诉Ext在页面上创建面板的位置。除了你的例子中的几个拼写错误，我认为主要问题是你的后续处理程序没有触发，因为你没有将它附加到你的面板对象。您需要将其指定为配置选项的一部分。您将后续处理程序分配给“this”，这很可能是示例中的顶级窗口对象。

Answer 2

这可能对您有用：

添加加载掩码

Ext.getBody().mask('Loading...', 'x-mask-loading', false);

删除加载掩码

Ext.getBody().unmask();

Answer 3

我把MyPanel的show函数放在delayedtask中。然后我将unmask实现放在MyPanel的beforedestroy监听器中。我认为这个LoadMask应该有一些回调机制。当我把节目放在一个和其他图层搞砸之后。

Ext.LoadMask保留在加载面板的后台

3 个答案: