时间戳

首页 > 解决方案 > 对象未推入本地存储阵列

javascript - 对象未推入本地存储阵列

问题描述

帮我！我将一组对象设置到本地存储中。我遇到的问题是，每当我推送新对象时，它都会删除最后一个对象并存储新对象并使用新对象存储数组更新。并只保留单个对象。但我想在数组中设置多个对象。我找不到我做错了什么。

    let recent_searched = [];
    let searched_item = {}
    
    const storeLocal = (e) => {
            searched_item['artwork'] = "image.jpg"
            searched_item['itemName'] = "Harry Potter"
            searched_item['itemWriterName'] = "J K Rowling"

            recent_searched.push(searched_item)

            localStorage.setItem("recent_searched", JSON.stringify(recent_searched));
     }

    console.log(JSON.parse(localStorage.getItem("recent_searched")))

标签： javascriptecmascript-6local-storage

解决方案

您的代码仅创建一个普通对象。它用 定义let searched_item = {}。即使它已经存在于数组中，其余代码也只会改变该单个对象。因此，您只需将重复的对象引用附加到您的数组中。

每次将其推送到数组时，都需要创建一个单独的对象。所以：

let recent_searched = [];

const storeLocal = (e) => {
    let searched_item = {   // This creates(!) an object
        artwork: "image.jpg",
        itemName: "Harry Potter",
        itemWriterName: "J K Rowling"
    };
    recent_searched.push(searched_item)

    localStorage.setItem("recent_searched", JSON.stringify(recent_searched));
}

如果您的页面重新加载，请注意您的数组变量不是从头开始维护和创建的。因此，请确保在页面加载时，您从本地存储中读取内容：

let stored = localStorage.getItem("recent_searched");
let recent_searched = stored ? JSON.parse(stored) : [];

推荐阅读