Comment stocker un tableau dans localStorage? [dupliquer]

cette question a déjà une réponse ici:

  • stockage D'objets dans HTML5 localStorage 27 Réponses

si je n'avais pas besoin de localStorage, mon code ressemblerait à ceci:

var names=new Array(); 
names[0]=prompt("New member name?");

ça marche. Cependant, je dois stocker cette variable dans localStorage et il s'avère assez têtu. J'ai essayé:

var localStorage[names] = new Array();
localStorage.names[0] = prompt("New member name?");

Où est-ce que je vais mal?

485
demandé sur Peter Mortensen 2010-07-29 01:14:27

6 réponses

localStorage supporte uniquement les cordes. Utilisez JSON.stringify() et JSON.parse() .

var names = [];
names[0] = prompt("New member name?");
localStorage.setItem("names", JSON.stringify(names));

//...
var storedNames = JSON.parse(localStorage.getItem("names"));
927
répondu Dagg Nabbit 2016-02-26 11:13:29

les localStorage et sessionStorage ne peuvent manipuler que des cordes. Vous pouvez étendre le stockage par défaut-objets pour manipuler des tableaux et des objets. Il suffit d'inclure ce script et d'utiliser les nouvelles 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))
}

utilisez localStorage.setObj(key, value) pour sauvegarder un tableau ou un objet et localStorage.getObj(key) pour le récupérer. Les mêmes méthodes fonctionnent avec l'objet sessionStorage .

si vous utilisez simplement les nouvelles méthodes pour accéder au stockage, chaque valeur sera convertie en JSON-string avant de sauvegarder et d'analyser avant qu'il ne soit retourné par le getter.

Source: http://www.acetous.de/p/152

101
répondu Sebastian 2012-04-11 15:40:44

Utiliser JSON.stringify() et JSON.parse() comme suggéré par pas de! Cela évite le problème peut-être rare mais possible d'un nom de membre qui inclut le délimiteur (par exemple nom de membre three|||bars ).

14
répondu jayeff 2014-07-15 18:20:08

vient de créer ce:

https://gist.github.com/3854049

//Setter
Storage.setObj('users.albums.sexPistols',"blah");
Storage.setObj('users.albums.sexPistols',{ sid : "My Way", nancy : "Bitch" });
Storage.setObj('users.albums.sexPistols.sid',"Other songs");

//Getters
Storage.getObj('users');
Storage.getObj('users.albums');
Storage.getObj('users.albums.sexPistols');
Storage.getObj('users.albums.sexPistols.sid');
Storage.getObj('users.albums.sexPistols.nancy');
5
répondu Klederson Bueno 2012-10-16 18:49:55

Le JSON approche fonctionne, sur ie 7, vous devez json2.js, avec lui, il fonctionne parfaitement et malgré le seul commentaire disant autrement il ya un stockage local sur elle. il semble vraiment comme la meilleure solution avec le moins de tracas. Bien sûr, on pourrait écrire des scripts pour faire essentiellement la même chose que json2 n'mais il y a peu de point.

au moins avec la chaîne de version suivante il y a localStorage, mais comme dit vous devez inclure json2.js parce que ce n'est pas inclus par le navigateur lui-même: 4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64; Trident / 5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; BRI / 2; NP06; .NET4.0C; .NET4.0E; Zune 4.7) (J'aurais fait ce commentaire sur la réponse, mais je ne peux pas).

3
répondu Lassi Kinnunen 2012-04-26 10:04:28

une autre solution serait d'écrire un emballage qui stocke le tableau comme ceci:

localStorage.setItem('names_length', names.length);
localStorage.setItem('names_0', names[0]);
localStorage.setItem('names_1', names[1]);
localStorage.setItem('names_' + n, names[n]);

supprime les frais généraux de conversion en JSON, mais serait ennuyeux si vous avez besoin de supprimer des éléments, comme vous auriez à re-indexer le tableau:)

2
répondu Znarkus 2012-01-09 21:53:34