等待加载多个 ExtJS 存储

Posted 2023-02-26

【中文标题】等待加载多个 ExtJS 存储

【英文标题】：Wait for multiple ExtJS store loaded

【发布时间】：2012-10-03 16:26:37

【问题描述】：

我在代码中的不同位置使用了多个商店 (JSON)。一种用途是根据某些条件将这些聚合到一个新商店中（其中已经有自己的数据）。

例如，我有两个商店：一个包含 position_id、position_name 和另一个包含 role_id、role_name。 现在有另一个商店部分初始化，我想使用两个先例商店来完成它。

例如：StoreRoles：role_id、role_value StorePositions : position_id, position_value StoreLineup : lineup_id, 参与者, role_id, role_value, position_id, position_value

在创建 StoreLineup 时，我希望 role_value 和 position_value 取值取决于他们的 id。

这可行，但并非总是如此。 事实上，当 ExtJS 传递给 StoreLineup 初始化时，StoreRoles 和 StorePositions 并不总是准备就绪。最后，数据并不总是设置好，我在这一点上遇到了一些 javascript 错误（因为我在现有元素上使用了 get()）。

所以我想延迟 StoreLineup 的初始化。 虽然没有加载其他两个商店，但 StoreLineup 一定也没有加载。必须在其他店铺创建完成后创建。

但是怎么做呢？ 我没有找到任何可行的解决方案（使用加载事件等）。 目标是在 GridPanel 中呈现完整的 StoreLineup。

我使用 ExtJS 3.4

【参考方案1】：

这在 4.x 中使用商店的 isLoading 方法 like this 要容易得多。

但是对于 3.4，您可以使用负载侦听器来完成它。

在创建网格面板之前，在您要加载的所有商店上附加一个加载侦听器。

在监听器中执行以下操作：

将加载的存储放入一个数组中，您可以将该数组附加到网格的父容器，使其不具有全局范围。例如。 myGridPanelsContainer.loadedStoresArray 什么的。

检查是否所有需要的商店现在都在myGridPanelsContainer.loadedStoresArray内

如果是，则创建网格。

如果没有，则什么也不做。

当最后一个存储加载时，负载监听器将创建网格。

【讨论】：

非常感谢！我使用你的解决方案，它工作正常。除非我不创建商店状态的网格亲戚，但如果所有其他商店（取决于它）已完全加载，则加载 LineupStore。所以只有在加载 LineupStore 时才会填充网格。

【参考方案2】：

提示一下，使用 Ext.util.MixedCollection 代替数组会更方便。

Ext.define('My.app.StoreLoader', 
    extend: 'Ext.util.MixedCollection',
    singleton: true,
    register: function (item) 
        this.add(item);
    ,
    unregister: function (item) 
        this.remove(item);
    ,
    getKey: function (o) 
        return o.instanceId;
    ,
    storeloadCallback: function (id, data) 
        var item = this.get(id);
        if (item) 
           this.unregister(item);

            //do more stuff if needed, like fire custom events, etc
       
    
);

这个例子基于来自Ext4All的惊人的“多文件上传器”

这里使用相同的原理，但不是存储加载，而是文件上传，虽然我们的行为非常相似。