Pousser les objets JSON au tableau dans localStorage

j'ai une fonction en Javascript:

var a = [];
function SaveDataToLocalStorage(data)
{       
    var receiveddata = JSON.stringify(data);
    a.push(receiveddata);
    alert(a);

    localStorage.setItem('session', a);

}

le paramètre data est un objet JSON.

mais chaque fois que je clique sur le bouton il écrase les données dans mon stockage local.

quelqu'un sait comment faire cela?

24
demandé sur nielsv 2013-04-18 17:11:13

5 réponses

il y a quelques mesures que vous devez prendre pour stocker correctement ces informations dans votre stockage local. Avant de passer au code, veuillez noter que localStorage (à l'heure actuelle) ne peut pas contenir tout type de données, sauf pour les chaînes. Vous aurez besoin de sérialiser le tableau pour le stockage et puis l'analyser de nouveau pour y apporter des modifications.

Étape 1:



le premier extrait de code ci-dessous ne doit être exécuté que si vous n'êtes pas stocker déjà un tableau sérialisé dans votre localStorage session variable.

Pour vous assurer que votre stockage localStorage est configuré correctement et stocke un tableau, exécutez le code suivant snippet en premier:

var a = [];
a.push(JSON.parse(localStorage.getItem('session')));
localStorage.setItem('session', JSON.stringify(a));

Le code ci-dessus ne doit être exécuté une fois et seulement si vous ne stockez pas déjà un array dans votre localStorage session variable. Si vous le font déjà, passez à l'étape 2.

Etape 2:

Modifier votre la fonction comme ceci:

function SaveDataToLocalStorage(data)
{
    var a = [];
    // Parse the serialized data back into an aray of objects
    a = JSON.parse(localStorage.getItem('session'));
    // Push the new data (whether it be an object or anything else) onto the array
    a.push(data);
    // Alert the array value
    alert(a);  // Should be something like [Object array]
    // Re-serialize the array back into a string and store it in localStorage
    localStorage.setItem('session', JSON.stringify(a));
}

Cela devrait prendre soin du reste pour vous. Quand vous l'analysez, il deviendra un tableau d'objets.

J'espère que cela vous aidera.

58
répondu War10ck 2016-02-04 05:40:53

a partir de maintenant, vous pouvez stockez seulement les valeurs des chaînes de caractères dans localStorage. Vous devrez sérialiser l'objet array et ensuite le stocker dans localStorage.

Par exemple:

localStorage.setItem('session', a.join('|'));

ou

localStorage.setItem('session', JSON.stringify(a));
8
répondu techfoobar 2013-04-18 13:23:16

mettre un tableau entier dans une entrée localStorage est très inefficace: l'ensemble doit être ré-encodé chaque fois que vous ajoutez quelque chose au tableau ou changez une entrée.

une alternative est d'utiliser http://rhaboo.org qui stocke n'importe quel objet JS, cependant profondément imbriqué, en utilisant une entrée localStorage séparée pour chaque valeur terminale. Les tableaux sont restaurés beaucoup plus fidèlement, y compris les propriétés non numériques et divers types de clairvoyance, objet les prototypes / constructeurs sont restaurés dans des cas standards et L'API est ridiculement simple:

var store = Rhaboo.persistent('Some name');
store.write('count', store.count ? store.count+1 : 1);

store.write('somethingfancy', {
  one: ['man', 'went'],
  2: 'mow',
  went: [  2, { mow: ['a', 'meadow' ] }, {}  ]
});  
store.somethingfancy.went[1].mow.write(1, 'lawn');

BTW, Je l'ai écrit.

6
répondu Adrian May 2014-10-01 11:40:36

une chose que je peux vous suggérer est d'étendre l'objet de stockage pour manipuler des objets et des tableaux.

LocalStorage ne peut gérer que des chaînes de sorte que vous pouvez atteindre que l'aide de ces méthodes

Storage.prototype.setObj = function(key, obj) {
    return this.setItem(key, JSON.stringify(obj))
}
Storage.prototype.getObj = function(key) {
    return JSON.parse(this.getItem(key))
}

en l'utilisant toutes les valeurs seront converties en JSON string sur set et parsed sur get

3
répondu Brugolo 2016-02-25 10:58:28
var arr = [ 'a', 'b', 'c'];
arr.push('d'); // insert as last item
-1
répondu Rajesh kumar 2013-09-28 07:53:27