问题描述
我有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}));
};