如何在Local Storage中存储对象数组?

时间:2017-05-03 14:06:04

标签: javascript arrays json

这是我的代码。我正在尝试创建一个对象数组,然后我将存储在本地存储中。这是问题所在,我需要先从Local Storage获取现有值。

然后我需要将新数据对象添加到现有数组中。然后我将其转换为JSON,以便将其存储在本地存储中。

onRegisterSubmit(){
    const user = {
        a: this.a,
        b: this.b,
        c: this.c,
      id: Date.now()
    }    

   var abc = [];
   var get =  JSON.parse(localStorage.getItem('user'));
   abc = [get];
   abc.push(user);

   localStorage.setItem('user', JSON.stringify(abc));

   console.log(JSON.stringify(abc));
   console.log(get);
  }

我希望JSON是一个像这样的对象数组,

[{"hour":1,"minute":21,"ampm":"PM","repeatDays":[],"message":"","todayOrTomorrow":"Tomorrow","isRepeatMode":false,"isEnabled":false,"id":"1493797882440"},{"hour":1,"minute":24,"ampm":"PM","repeatDays":[],"message":"","todayOrTomorrow":"Tomorrow","isRepeatMode":false,"isEnabled":false,"id":"1493797896257"},{"hour":6,"minute":14,"ampm":"PM","repeatDays":[],"message":"","todayOrTomorrow":"Tomorrow","isRepeatMode":false,"isEnabled":false,"id":"1493815470408"}]

这是我的JSON。

[[[[[[[{"id":1493820594019},{"id":1493820606448}],{"id":1493820609111}],{"id":1493820610150}],{"id":1493820610553}],{"id":1493820610827}],{"id":1493820611015}],{"id":1493820612018}]

我已经尝试了几天,我们将非常感谢任何帮助。

3 个答案:

答案 0 :(得分:19)

该代码的问题是:

  1. 您将结果包装在数组中,但理论上,您希望已经拥有数组。

  2. 您正在存储user,而不是getabc (您通过编辑将其删除了。)

  3. 要存储数组,请执行您正在执行的操作:

    localStorage.setItem("users", JSON.stringify(users));
    

    获取阵列:

    users = JSON.parse(localStorage.getItem("users") || "[]");
    

    请注意,如果getItem返回null,那么它会提供默认(空数组),因为我们从未将用户存储在那里。

    将用户添加到阵列:

    users.push({id: 1, foo: "bar"});
    

    示例(live on jsFiddle [Stack Snippets不允许本地存储] ):

    (function() { // Scoping function to avoid creating globals
        // Loading
        var users = JSON.parse(localStorage.getItem("users") || "[]");
        console.log("# of users: " + users.length);
        users.forEach(function(user, index) {
            console.log("[" + index + "]: " + user.id);
        });
    
        // Modifying
        var user = {
            id: Math.floor(Math.random() * 1000000)
        };
        users.push(user);
        console.log("Added user #" + user.id);
    
        // Saving
        localStorage.setItem("users", JSON.stringify(users));
    })();
    

    它会显示控制台中当前用户的列表,每次刷新页面时都会添加一个。

答案 1 :(得分:2)

请参阅this post

您无法存储对象,您必须存储字符串。因此,解决方法是在存储对象之前对其进行字符串化(例如,您可以将其更改为JSON对象,存储它,并在需要时再次读取它)。

答案 2 :(得分:2)

尝试这样的事情: - 链接https://jsfiddle.net/sureshraina/nLexkyfw/1/

var mydatas = new Array();
        mydatas[0] = "data";
        mydatas[1] = "data1";
        mydatas[2] = "data2";

        localStorage["mydatas"] = JSON.stringify(mydatas);

        var datas = JSON.parse(localStorage["mydatas"]);