在localStorage中向对象添加对象

Question

好吧,我试图在这里按照例子,我知道可能有一些不同的方法在localstorage中向数组添加对象而不是覆盖它但我没有找到至少其中一个.

得到这个代码来存储数组中的对象,但它会覆盖自己.愿有人告诉我我错过了什么吗？(而且我担心我可能会失踪很多).

function addEntry() {
    var entryTitle = document.getElementById("entryTitle").value;
    var entryText = document.getElementById("entryText").value;
    var entry = {
        "title": entryTitle,
        "text": entryText
    };
    localStorage.setItem("entry", JSON.stringify(entry));
    var allEntries = [];
    allEntries.push(entry);
    localStorage.setItem("allEntries", JSON.stringify(allEntries));
};

Answer 1

当你使用setItem它时会覆盖它之前的项目.您需要使用它getItem来检索旧列表,附加到它,然后将其保存回localStorage:

function addEntry() {
    // Parse any JSON previously stored in allEntries
    var existingEntries = JSON.parse(localStorage.getItem("allEntries"));
    if(existingEntries == null) existingEntries = [];
    var entryTitle = document.getElementById("entryTitle").value;
    var entryText = document.getElementById("entryText").value;
    var entry = {
        "title": entryTitle,
        "text": entryText
    };
    localStorage.setItem("entry", JSON.stringify(entry));
    // Save allEntries back to local storage
    existingEntries.push(entry);
    localStorage.setItem("allEntries", JSON.stringify(existingEntries));
};

这是一个演示上述内容的小提琴.

Answer 2

也许你只需要在推送新条目之前获取条目:

var allEntries = JSON.parse(localStorage.getItem("allEntries")) || [];
allEntries.push(entry); 
//etc...