如何使用json创建数组并将其存储在本地存储中

Question

嗨，大家好，我有一个接受项目名称，代码等数据的表格，所以当我按下回车按钮... iv使用json stringify并获得本地存储内容的警报时。 但是，当我单击“重置”并创建一个新项目时，它仅显示该新项目，无论如何我可以将所有创建的项目存储在本地存储中吗？ 这是我编码的一部分。 我是初学者，如果问题太简单，请原谅

谢谢

$('#myBox #EnterButton').click(function() {
    ItemData = { 
        'ItemCode' : $('#ItemCode').val(),
        'ItemName' : $('#ItemName').val()
    };

    localStorage.ItemData=JSON.stringify(ItemData);
    $('#myBox').slideUp();
});

...

$('#myBox2 #EnterButton').click(function() {
    if (localStorage.ItemData) {
        alert(localStorage.ItemData);
        ItemData = JSON.parse(localStorage.ItemData);
    }

    if (ItemData.ItemCode) {
        $('#myBox #ItemCode').val(ItemData.ItemCode);
    }

    if (ItemData.ItemName) {
        $('#myBox #ItemName').val(ItemData.ItemName);
    }
})

我已经宣布itemdata为公共变量。 希望它清除。 TIA

Answer 1

您必须组织您使用localStorage的方式（getter / setter类可能有助于维护）。 从上面的代码中，您似乎总是用刚刚插入的值覆盖localStorage.ItemData 。 解决方案是将localStorage.Items设为一个数组，每当您在该数组中插入时，对其进行迭代，以查看是否尚未添加（例如基于itemCode），然后覆盖或插入一个新项目。

我认为这足以玩耍。 比localStorage更高级的概念和用于稍微不同的目的的概念是pouchdb-浏览器中的websql。

Answer 2

听起来好像如果要存储多个项目，则应该使用itemData对象的数组。 然后，您必须解析此（数组），并使用类似Array.push（newItem）的方法，然后再次对其进行字符串化，然后再保存。

var allItems = localStorage.getItem('ItemData');
if(allItems == null) {
    localStorage.setItem('ItemData', JSON.stringify([ItemData]));
} else {
    allItems = JSON.parse(allItems);
    allItems.push(ItemData);
    localStorage.setItem('ItemData', JSON.stringify(allItems));
}