Je travaille juste sur une application web avec senchatoucher. Je dois implémenter un magasin (lié à une grille) qui est disponible hors ligne (offlineStorage) mais récupère et met à jour les données en ligne (REST) dès que la connexion Internet est disponible. Cela est nécessaire car j'ai beaucoup de données et je fais beaucoup de filtrage et de recherche à distance sur le magasin. Je ne peux pas charger le magasin complet depuis le début car il est trop grand. De préférence, j'aimerais utiliser un magasin hors ligne pour une expérience utilisateur rapide. Les nouveaux filtres / demandes devraient demander des données au serveur (boutique en ligne) et les mettre à jour / ajouter au magasin hors ligne pour rester synchronisés avec le serveur.
Grille <-bind-> Store (offlineStorage) <-request data remote on new filter-> online Store
Un point de départ pour moi est http://www.sencha.com/learn/taking-sencha-touch-apps-offline/#leave-reply. Cependant, je dois déclencher la boutique en ligne dès que les données sont chargées à partir du stockage hors ligne ou qu'un filtre est défini.
Quelqu'un a-t-il déjà mis en œuvre quelque chose comme ça? Des conseils / idées sur la façon de le mettre en œuvre?
J'apprécie vraiment votre aide!!
Réponses:
3 pour la réponse № 1Dans Sencha Touch, il est très facile de «synchroniser» et de stocker en ligne avec les données extraites vers un autre magasin «hors ligne».
Définissez un magasin hors ligne:
// Offline store (local storage)
var schouwLijstOffline = new Ext.data.Store({
model: "schouwLijst",
storeId: "schouwLijstOffline",
proxy: {
type: "localstorage",
id: "schouwid"
},
});
Vous pouvez maintenant utiliser un écouteur sur votre magasin principal (première extraction de données) et écouter l'événement de chargement (dans ce cas déclenché manuellement en raison de "autoLoad: false").
Dans le chargeur, vous "effacez ()" le proxy du magasin hors ligne, puis remplissez le magasin hors ligne avec des données avec le "storeId"*.ajouter()* une fonction.
Dans mon exemple, je supprime ensuite toutes les informations de la "boutique hors ligne" car je n'en ai plus besoin (c'est maintenant dans la ligne hors ligne).
Boutique en ligne avec auditeur:
var schouwLijstStore = new Ext.data.Store({
model: "schouwLijst",
storeId: "schouwLijstStore",
proxy: {
type: "ajax",
url: "php/json.php?t=list",
reader: {
type: "json",
root: "list"
},
},
autoLoad: false,
listeners: {
load: function() {
// Clear proxy from offline store
schouwLijstOffline.proxy.clear();
// Loop through records and fill the offline store
this.each(function(record) {
schouwLijstOffline.add(record.data);
});
// Sync the offline store
schouwLijstOffline.sync();
// Remove data from online store
schouwLijstStore.removeAll();
}
}
});
Maintenant, lorsque vous faites une nouvelle demande pour récupérer de nouveaux filtres / données, vous pouvez répéter le même processus:
- Déclencher la boutique en ligne (storeId.update ();)
- L'auditeur ajoute les données de la boutique en ligne à la boutique hors ligne
- Utilisez le magasin hors ligne
Supplémentaire:
Pour supprimer toutes les données d'un magasin, vous pouvez utiliser: storeId.removeAll ();
Je pense que cela vous fera avancer dans la bonne direction, si quelque chose n'est pas clair, dites-le.