Ext setLoading(true,true)调用太晚

Ext setLoading(true,true) being called too late?

本文关键字：true 调用 setLoading Ext      更新时间：2023-09-26

我有一个包含大量数据的网格，用户可以使用组合框过滤或显示/隐藏列组。有些列开关需要很长时间才能加载，我想在网格或组合框上调用setLoading(true,true)，向用户显示浏览器正在工作。

我有一个侦听器函数，当用户在组合框上进行选择时调用它。在开始任何需要一段时间才能执行的代码之前，我调用combo.setLoading(true,true)。然后在函数的最底部调用combo.setLoading(false,false)。

加载只在两个setLoading调用之间的代码被执行后的一瞬间显示。如果我取消了删除加载图标的调用，图标仍然只在代码执行后显示。

有人知道发生了什么事吗?这对我来说很奇怪。

categorycomboselect: function(combo, records){
    combo.setLoading(true,true);
    var panel = combo.up('panel');
    console.log(panel);
    var category = records[0].data.name;
    var grid = Ext.ComponentQuery.query('grid')[1];
    Ext.suspendLayouts();
    grid.suspendedLayout=true;
    var columns = grid.columns;//.getView().getGridColumns();
    //slow code that shows/hides columns
    grid.suspendedLayout=false;
    Ext.resumeLayouts(true);
    combo.setLoading(false,false);
},

这是我的代码与Trimboli的建议，它仍然不工作。我正在显示/隐藏基于其ID中的字符串的列。我这样做是因为我想要显示/隐藏列的类别是动态的，列也是动态的。

categorycomboselect: function(combo, records){
    combo.setLoading(true,true);
    setTimeout( function(){
            var panel = combo.up('panel');
            var category = records[0].data.name;
            var grid = Ext.ComponentQuery.query('grid')[1];
            Ext.suspendLayouts();
            grid.suspendedLayout=true;
            var columns = grid.columns;
            if(category=='All grade items'){
                for(var i = 0; i< columns.length; i++){
                        columns[i].setVisible(true);
                }
            }else{
                for(var i = 0; i< columns.length; i++){
                    columns[i].hide();//setVisible(false);
                    if(!(typeof columns[i].itemId ==='undefined')){
                        if((columns[i].itemId).indexOf(category)>=0){
                            columns[i].show();
                        }
                    }
                }
            }
            grid.suspendedLayout=false;
            Ext.resumeLayouts(true);
            combo.setLoading(false,false);
    },1);
},

还有，我不确定是否

Ext.suspendLayouts();
grid.suspendedLayout=true;

是否做同样的事情。

你实际上在做的是:

showMask();
for (i = 0; i < 10000000; ++i) {
    // busy loop
}
hideMask();

如果你显示/隐藏一个掩码而没有给浏览器一个"break"来更新DOM，你将看不到任何东西，因为一旦你把控制权交还给浏览器，它就会在最后被刷新。

如果您想让掩码实际显示，则需要在继续执行忙循环之前稍微延迟一下:

showMask();
setTimeout(function() {
    // Busy stuff
    hideMask();
}, 1);
相关文章：