Question

我有一个包含大量数据的网格，用户可以使用组合框过滤或显示/隐藏列组。一些列开关需要很长时间才能加载，我想在网格或组合框上调用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;

做同样的事情。如果没有，哪个更好。

Answer 1

你基本上是这样做的：

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

如果你显示/隐藏一个掩码而不给浏览器一个“中断”来更新DOM，你将看不到任何东西，因为一旦你将控制权交还给浏览器，它们就会被刷掉。< / p>

如果你想让面具真正显示，你需要稍微延迟才能继续忙碌的循环：

showMask();
setTimeout(function() {
    // Busy stuff
    hideMask();
}, 1);

Ext setLoading（true，true）被调用太晚了？

1 个答案: