我有一个带有按钮的gridview。单击该按钮时,它将从控制器调用方法。在那个方法中,我试图显示一个加载屏幕,然后做一些事情,然后隐藏加载屏幕。像这样:
Ext.getCmp('center-panel').setLoading(true);
// do something that takes a couple seconds
Ext.getCmp('center-panel').setLoading(false);
但是setLoading(true)直到方法运行完毕后才会启动。如果我注释掉setLoading(false),加载屏幕将自动显示,直到2秒之后,然后永远不会消失。
有人知道这是否可能,或者我做了一些根本错误的事情?中心面板在我的视口中定义如下:
Ext.define('HelperBatchForm.view.Viewport', {
extend: 'Ext.container.Viewport',
layout: 'fit',
items: [
{
region: 'center',
id: 'center-panel',
title: 'Batches',
split: true,
collapsible: true,
xtype: 'batchgrid'
}
,
{
region: 'south',
id: 'south-panel',
title: 'Batch Form',
split: true,
//collapsible: true,
xtype: 'batchedit'
}
],
initComponent: function () {
this.callParent(arguments);
}
});
谢谢!
答案 0 :(得分:0)
必须使用'#'表示ids:
Ext.getCmp('#center-panel').setLoading(true);
击> <击> 撞击>
无论如何,你不想在你的“需要几秒钟的事情”之后立即调用setLoading(false),因为它会很快被解雇。
您希望将回调函数传递到几秒钟内,然后从那里调用setLoading(false)。
示例:
somePanel.setLoading(true);
someStore.load({
callback:function(){
somePanel.setLoading(false);
}
});
答案 1 :(得分:0)
我遇到了同样的问题,并通过在存储的'beforeload'监听器中调用setLoading(true)并在加载回调中调用setLoading(false)来解决它。这非常有效。
以下是视图控制器的一个示例:
configureStore: function(store) {
var me = this;
store.on('beforeload', me.onStoreBeforeLoad, me);
store.load({
callback:function() {
me.getView().setLoading(false);
}
});
},
onBeforeStoreLoad: function(store, operation, eOpts) {
this.getView().setLoading(true);
}
答案 2 :(得分:0)
您需要在加载前显示面板/其他内容。 E.g:
var pnl = Ext.create('my.WhateverPanel');
pnl.show();
pnl.setLoading(true);
setTimeout(function (){
pnl.setLoading(false);
}
,3000);
答案 3 :(得分:0)
所以我找不到一个完美的解决方案,但我发现的是一个很好的解决方法
Ext.getCmp('center-panel').setLoading(true);
Ext.Function.defer(function () {
// do something that takes a couple of seconds in here
Ext.getCmp('center-panel').setLoading(false);
}, 10);
答案 4 :(得分:-1)
this.getView()。setLoading('Loading module ...');
setTimeout(function(){
//处理下一步要做的事情。例如:me.setCurrentView(id);
},1);