在本地存储上保存多个对象? Java脚本

问题描述

我有2个房间{roomId: room1,roomId: room2},我想将每个房间的对象保存在localStorage上。

对象看起来像

let notifiedRoom = {
    roomId: roomId,dismissed: true
}; 

用户关闭各个房间的通知时,notifiedRoom对象将保存在localStorage上。


import React from 'react';
import { toast } from 'react-toastify';


const RoomNotification = (props) => {

  const { roomId,message } = props;

  const setLocalStorage = (roomId) => {
    let notifiedRoom = {
        roomId: roomId,dismissed: true
       }; 
    localStorage.setItem('notifiedRoom',JSON.stringify(notifiedRoom));
  };

  const notify = () => {
    toast(<div><p>{roomId}</p><p>{message}</p></div>,{
            toastId: roomId,position: "top-center",draggable: true,onClose:() => setLocalStorage(roomId)
        });
   };

}

我的问题是,一次只能为一个房间保存一个对象。因此,如果您关闭room1通知,然后在localStorage上 有roomId: room01,dismissed: true,如果我关闭room2通知,则room1会覆盖room1的先前localStorage对象。

如果roomId匹配,我只需要覆盖它。否则,只需在locatStorage上为每个不同的roomId创建一个新对象。

非常感谢

解决方法

除了执行此操作{roomId: room1,roomId: room2},您还可以执行以下操作:

{room1: room1Data,room2: room2Data}

因此,如果您要更新任何一个,例如room1。

const setLocalStorage = (roomId) => {
   const initialUpdateData = JSON.parse(localStorage.getItem('notifiedRoom')) ||{room1:null,room2:null}
    let updatedRoom = {
   ...initialUpdateData,[updatedRoom]:{
      roomId: roomId,dismissed: true
  }
  }; 
    localStorage.setItem('notifiedRoom',JSON.stringify(updatedRoom));
  };

注意:updatedRoom是您的1室或2室

,

很容易,您只需为新的本地存储命名并为其设置数组

localStorage.setItem('1',JSON.stringify(new_array));
localStorage.setItem('2',JSON.stringify(new_array));

明智的做法-因此它将为每个通知房间创建新的存储空间

再一次,当您需要检索存储时-可以按其名称进行检索

var room1= JSON.parse(localStorage.getItem('1'));
var room2= JSON.parse(localStorage.getItem('2'));

希望这是您想要的

,

您需要在一个对象内拥有唯一的键,这样:

{room1:{dismissed:true},room2:{dismissed:true}}

const setLocalStorage = (roomId) => {
 const notifiedRoom = JSON.parse(localStorage.getItem('notifiedRoom'))
 notifiedRoom[roomId] = {dismissed: true}
 localStorage.setItem('notifiedRoom',JSON.stringify({...notifiedRoom}));
};