Alle Artikel einer Gruppe aus WebStorage abrufen

Question

Ich möchte ein einfaches Einkaufswagensystem auf meiner Website mit WebStorage implementieren. Artikel sind Bilder mit Format und Menge Werte. Es gibt einen Zählerwert, der die Anzahl der Elemente in dem Speicher zur Zeit enthält und jedes neues Element wird in diesem Format WebStorage hinzugefügt:

item<id> = 1:3,5 

Jetzt habe ich ein Problem mit Einzelteilen aus dem Speicher auflistet. wenn Benutzer 5 Elemente zum Beispiel kaufen und entfernt item0 und item3 (item -= 2), würde ich nicht in der Lage sein, alle Werte mit einfachen for-Schleife zu erhalten, auch wenn ich überprüfe, ob Element im Speicher vorhanden ist:

var len = parseInt(localStorage.getItem("items")); 
for (let i = 0; i < len; i++) { 
    if (localStorage.getItem("item" + i)) { 
     // show element on the page 
    } 
} 

Len wird drei, aber ich werde immer noch die item5, die nicht angezeigt werden würde.

Soll ich die ID eines neuen Arrays von Elementen erstellen und IDs entfernen, wenn Elemente von der Seite gelöscht werden, oder gibt es einen besseren Weg, damit umzugehen?

Answer 1

Es wäre am besten, ein JSON-Objekt zu verwenden, um alle Ihre Inhalte zu behandeln.

Ihr Code würde so aussehen wie diese Daten setzen:

// initial data 
var cartData = { 
    items: ['item1', 'item2', 'item3'] 
}; 

// stringify your object so it can be saved into localStorage 
localStorage.setItem('cart', JSON.stringify(cartData)); 

Dann können Sie leicht/Schleife durch die Elemente entfernen:

// get cart 
var cartData = JSON.parse(localStorage.getItem('cart')); 

// delete 2nd item 
cartData.items.splice(1, 1); 

// loop through items 
for(var i = 0, l = cartData.items.length; i < l; i++) { 
    // do something with cartData.items[i] 
}