将 JSON 对象推送到 localStorage 中的数组

Posted

技术标签:

【中文标题】将 JSON 对象推送到 localStorage 中的数组【英文标题】:Push JSON Objects to array in localStorage 【发布时间】:2013-04-11 14:59:55 【问题描述】:

我在 javascript 中有一个函数:

var a = [];
function SaveDataToLocalStorage(data)
       
    var receiveddata = JSON.stringify(data);
    a.push(receiveddata);
    alert(a);

    localStorage.setItem('session', a);


data 参数是一个 JSON 对象。

但每次我点击按钮时,它都会覆盖我本地存储中的数据。

有人知道怎么做吗?

【问题讨论】:

尝试使用window.a = [];,然后像这样推送; window.a.push(receiveddata)。或者只是在函数开头的新“a”中存储一次。 你也是在实际输入上做的吗? localStorage.setItem('session', window.a); localStorage 的类型是什么?并且它将覆盖,因为您为相同的密钥会话设置了相同的值。 【参考方案1】:

截至目前,您只能将字符串值存储到 localStorage。您需要序列化数组对象,然后将其存储在 localStorage 中。

例如:

localStorage.setItem('session', a.join('|'));

localStorage.setItem('session', JSON.stringify(a));

【讨论】:

【参考方案2】:

您需要采取几个步骤才能将此信息正确存储在 localStorage 中。然而,在我们开始编写代码之前,请注意 localStorage(在当前时间)不能保存除字符串之外的任何数据类型。您需要对数组进行序列化以进行存储,然后将其解析出来以对其进行修改。

第 1 步:仅当您尚未在 localStorage session 变量中存储序列化数组时,才应运行下面的第一个代码 sn-p。 为确保您的 localStorage 设置正确并存储数组,请先运行以下代码 sn-p:

var a = [];
a.push(JSON.parse(localStorage.getItem('session')));
localStorage.setItem('session', JSON.stringify(a));

上述代码只应运行一次,并且仅当您尚未在 localStorage session 变量中存储 array 时。如果您已经在执行此操作,请跳至第 2 步。

第 2 步:

像这样修改你的函数:

function SaveDataToLocalStorage(data)

    var a = [];
    // Parse the serialized data back into an aray of objects
    a = JSON.parse(localStorage.getItem('session')) || [];
    // Push the new data (whether it be an object or anything else) onto the array
    a.push(data);
    // Alert the array value
    alert(a);  // Should be something like [Object array]
    // Re-serialize the array back into a string and store it in localStorage
    localStorage.setItem('session', JSON.stringify(a));

这应该会为您处理其余的事情。当你解析出来时,它会变成一个对象数组。

希望这会有所帮助。

【讨论】:

@user1775531 没问题,伙计!乐意效劳。祝你好运,编码愉快! :) 谢谢。你知道如何将它作为单独的数组从本地存储中取出吗? @user1775531 不确定我是否在关注你,伙计?将其作为单独的数组取出?是数组数组吗? @War10ck,嗨,我只是偶然发现了这个并且喜欢这个想法。您能否看看***.com/questions/17612962/… 并说一下这是否是一种合适的方法? @War10ck super...能否请您显示代码以检查数组中的数据,如果存在我需要进行操作..谢谢。【参考方案3】:
var arr = [ 'a', 'b', 'c'];
arr.push('d'); // insert as last item

【讨论】:

【参考方案4】:

我可以建议您的一件事是扩展存储对象以处理对象和数组。

LocalStorage 只能处理字符串,因此您可以使用这些方法实现这一点

Storage.prototype.setObj = function(key, obj) 
    return this.setItem(key, JSON.stringify(obj))

Storage.prototype.getObj = function(key) 
    return JSON.parse(this.getItem(key))

使用它,每个值都将在设置时转换为 json 字符串并在获取时解析

【讨论】:

以上是关于将 JSON 对象推送到 localStorage 中的数组的主要内容,如果未能解决你的问题,请参考以下文章

postgresql 函数 - 如何将新的 json 对象推送到 json 数组?

Angular,将 JSON 对象推送到服务器

如何以角度将数组推送到 JSON 对象

如何将 JSON 对象推送到 postgresql 中 jsonb 列中的数组

将检索到的对象推送到 React 中的状态只会给我带来最后一个

JavaScript 推送到数组