Javascript 在 ExtJS 中，如何在显示网格时加载商店？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2235677/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
In ExtJS, how do I load a store when I display a grid?
提问by Daniel T.
In ExtJS, how do I load a store when I display a grid? I want the store to load only when the grid is displayed (the user clicks on a button to show the grid, so it's wasteful to load the store beforehand). I tried the afterrenderlistener but it renders the loadmask in the wrong location, and the afterlayoutlistener reloads the grid every time the grid is resized.
在 ExtJS 中，如何在显示网格时加载商店？我希望商店仅在显示网格时加载（用户单击按钮以显示网格，因此预先加载商店很浪费）。我尝试了afterrender侦听器，但它在错误的位置呈现加载掩码，并且afterlayout每次调整网格大小时侦听器都会重新加载网格。
回答by Shea Frederick
This is one of those things that can be a bit of a pain to accomplish because were giving the browser too much to do at once (particularly noticeable in IE).
这是完成起来可能有点痛苦的事情之一，因为要让浏览器立即做太多事情（尤其是在 IE 中）。
I like to use a combination of defer to let the browser recover long enough to render things properly.
我喜欢结合使用 defer 来让浏览器恢复足够长的时间以正确呈现内容。
var grid = new Ext.grid.GridPanel({
...,
listeners : {
render : function(grid){
grid.body.mask('Loading...');
var store = grid.getStore();
store.load.defer(100, store);
},
delay: 200
}
});
Playing with the value of delay/defer should give you the desired results. The length of time you will need to delay/defer is dependent upon how complex your Grid is and how fast the browser is.
使用延迟/延迟的值应该会给你想要的结果。您需要延迟/推迟的时间长度取决于您的网格有多复杂以及浏览器有多快。
Also remember to remove the mask when your Store's load has completed.
还记得在商店加载完成后取下面具。
listeners: {
load: function(){
yourGrid.body.unmask();
}
}
NOTE: Just a few clarifications to the answer by Lloyd - you do not need to set autoLoad to false, because that is the default (ie: don't set it at all) and it sounds like from your description that you would want to use the Stores load method, instead of reload.
注意：只需对劳埃德的答案进行一些澄清 - 您不需要将 autoLoad 设置为 false，因为这是默认设置（即：根本不设置它），并且从您的描述中听起来您想要使用 Stores 加载方法，而不是重新加载。
回答by Li0liQ
Have you considered handling activateevent? You can add an event handler that loads data on activateevent and then removes itself.
您是否考虑过处理activate事件？您可以添加一个事件处理程序，在activate事件上加载数据，然后删除自身。
this.on('activate', function(){
this.un('activate', arguments.callee);
this.store.load();
}, this);
Here thisrefers to GridPanel.
这里this指GridPanel。
回答by Lloyd
You can set autoLoad to false for the store and just call store.reload(); when the user clicks on the button to show the grid.
您可以将商店的 autoLoad 设置为 false 并调用 store.reload(); 当用户单击按钮以显示网格时。
