存储加载后 ExtJs 的事件答案

【问题标题】：Event for ExtJs after Store Load存储加载后 ExtJs 的事件
【发布时间】：2016-12-20 09:59:31
【问题描述】：

我想在 storeLoad() 之后在 ExtJS 网格中触发一个事件。除了渲染之后，还有什么我可以使用的事件吗？

afterrender: function(grid) {
            var store = grid.getStore();
            if (store.isLoaded()) {
               // not getting debugger here.
            }
        },

【问题讨论】：

标签： extjs

【解决方案1】：

只需在您的商店中使用加载事件：

var store = grid.getStore();
store.on('load', function(){
    //Your function here
});

编辑：您应该检查商店是否已经加载：

var handler = function(){ /* Your function here */ }
if (store.isLoaded()) {
    handler.apply(this);
} else {
    store.on('load', handler, this);
}

【讨论】：

感谢您的回答。但是我应该在哪里做呢？在 init 函数中或在 afterrender 函数中
@David 在 afterrender 函数中应该没问题
@David 或者，如果您的商店将 autoload 设置为 false，就在您调用 load() 函数之前
非常感谢卢多维奇
@PredragStojadinović 也许您的商店已经加载完毕？您应该检查是否是这种情况，然后调用您的函数，如果它已经加载。

【解决方案2】：

仅在@ludovic-feltz 请求中发布此内容:)

我认为这是一个 hack 而不是一个正确的解决方案...

基本上，在渲染之后，我会稍微延迟 isLoaded 检查，如果没有加载，我会每隔 100 毫秒重复一次，直到加载存储来设置排序，或者用它做任何其他事情。

我走这条路是因为store.isLoading()给了我false:(

listen: {
    component: {
        'grid': {
            afterrender: 'onGridAfterRender'
        }
    }
},

onGridAfterRender: function () {
    setTimeout(this._setInitialSorting.bind(this), 10);
},

_setInitialSorting: function () {
    var view = this.getView();
    var grid = view.down('grid');
    var store = grid.getStore();

    // remove this console.log's
    console.log('\n_setInitialSorting', new Date().getTime(), store.isLoading(), store.isLoaded());
    
    if (store.isLoaded()) {
        store.sort([{property: 'column1', direction: 'ASC'}]);
        return;
    }

    setTimeout(function () {
        this._setInitialSorting();
    }.bind(this), 100);
},

我刚刚添加了上面的console.log，看看发生了什么，结果是这样的：

_setInitialSorting 1593589691157 false false
_setInitialSorting 1593589691258 true false
_setInitialSorting 1593589691360 true false
_setInitialSorting 1593589691584 false true

我希望我以前也这样做过：D

所以似乎 isLoading 在afterrender 事件中最初是false！但是 100 毫秒后它转到 true！

所以，我将超时时间更改为仅 10 毫秒，以获取一些垃圾邮件：

_setInitialSorting 1593589864967 false false
_setInitialSorting 1593589865007 true false
_setInitialSorting 1593589865016 true false
...
_setInitialSorting 1593589865159 true false
_setInitialSorting 1593589865165 true false
_setInitialSorting 1593589865383 false true

同样，afterrender 事件之后的第一个isLoading 检查是false，然后变为true...

顺便说一句，为了全面披露，我确实尝试过：

listen: {
    store: {
        '*': {
            load: 'onStoreLoaded',
        }
    }
},

但它只是让 UI 一直闪烁而不显示任何数据:(

【讨论】：