Comment attendre que tous les magasins soient chargés en ExtJs?

utiliser les timeouts n'est pas une bonne solution, cependant avoir à compter sur tout dans le gestionnaire de magasin n'est pas génial non plus.

je ferais quelque chose comme:

var allStores = [store1, store2],
    len = allStores.length,
    loadedStores = 0,
    i = 0;

for (; i < len; ++i) {
    allStores[i].on('load', check, null, {single: true});
}

function check() {
    if (++loadedStores === len) {
        AllStoresLoaded();
    }
}

function AllStoresLoaded() {
    //Do Something
}

Si vous l'utilisez beaucoup, vous pouvez même le transformer en une classe.

étendre le magasin-ajouter la propriété 'loaded' à la classe enfant, outrepasser ' initComponent ()' et attacher à l'événement 'load' à l'intérieur de celui-ci, relancer le 'loaded' vers true à l'intérieur du gestionnaire d'événements, ajoutez le ' isLoaded ()' méthode valeur de retour de la propriété' loaded'.

dans l'autre sens, si vous utilisez http transport-store.proxy.Connecticut.isLoading ()

regardez

function storeLoadingHandler(justLoadedStore) {
    // I use some quick hacky flag, you can do it by your own way
    justLoadedStore.loaded = true;

    var allStoresLoaded = true;

    // just walk through all stores registered in the application
    // do not forget to use MVC-style stores or add 'storeId' manually
    // or register every store with your custom code
    Ext.StoreManager.each(function(existingStore) {
        // we have to ignore system stores
        if (existingStore.storeId != 'ext-empty-store') {
            if (!existingStore.loaded) { // our flag or undefined
                // nope, at least one of stores is not loaded
                allStoresLoaded = false;

                return false
            }
        }
    })

    if (allStoresLoaded) // then do something
        alert('All stores are loaded.');
}

// add the loading handler for all stores
Ext.StoreManager.each(function() {
    this.on('load', storeLoadingHandler);
})

si vous avez un problème parce que les combobox ne sont pas affichés/rafraîchis correctement quand les magasins prennent trop de temps à charger, la solution est de créer chaque magasin qui doit être utilisé dans un combobox comme ceci

Ext.create("Ext.data.Store", {
    ...,
    loading: true,
    ...
});

Comboboxes vérifiez ce paramètre dans les magasins qu'ils utilisent pour rafraîchir l'information une fois qu'elle est chargée, mais parfois le combobox est créé et rafraîchi avant même que le magasin commence à charger et le drapeau 'loading' est mis à true, Et alors il ne rafraîchira pas sa valeur quand le magasin termine le chargement. Le paramétrer à true corrige explicitement le problème. Je ne sais pas si c'est votre cas, mais j'ai pensé le mentionner au cas où.

Use Sett JS

Deft JS est un addon injecté par injection de dépendance. Il permet à l'utilisateur d'ajouter des promesses dans les appels AJAX et la promesse est résolu que lorsque l'appel est terminé. Lien pour Habile JS. Utilisez Ext.différer.Tous les(); pour charger tous vos 5 magasins et une fonction de rappel particulière sera appelée une fois que tous les magasins sont chargés. Dans cette fonction, implémentez votre logique.

ExtJs Magasin de la méthode charger et la méthode load ont une fonction de rappel.

j'ai créé une démo. vous pouvez vérifier ici Sencha violon

cette fonction va créer le stockage et le retour.

function createStore(id) {
    return Ext.create('Ext.data.Store', {
        storeId: 'store_' + id,
        alias: 'store.store_' + id,
        proxy: {
            type: 'ajax',
            url: 'data.json',
            timeout: 300000,
            reader: {
                type: 'json',
                rootProperty: 'data'
            }
        }
    });
}

Par Exemple, j'ai matrice de magasin. Il contient storeId ou alias.

var storeArry = [],
    store = '';

for (var key = 0; key < 5; key++) {
    storeArry.push(createStore(key).storeId);
}

sur chaque callback de magasin nous pouvons supprimer des données de storeArray ou maintenir une variable pour vérification.

Ext.getBody().mask('Please wait..');
Ext.defer(function () {
    Ext.getBody().unmask();
    Ext.Array.forEach(storeArry, function (storeId) {
        //For checking store is created or not
        //if store is not created we can create dyanamically using passing storeId/alias
        store = Ext.getStore(storeId);
        if (Ext.isDefined(store) == false) {
            store = Ext.create(storeId);
        }
        store.load({
            callback: function () {
                //On every store call back we can remove data from storeArray or maintain a veribale for checking.
                Ext.Array.remove(storeArry, this.storeId);
                if (storeArry.length == 0) {
                    Ext.Msg.alert('Success', 'All stored is loaded..!');
                }
            }
        });
    });
}, 3000);