Question

我正在React中制作一个出现日历，并使用localStorage，以便当用户第二天返回时打开的门保持打开状态。

我能够写入和读取localStorage，但是当用户第一次单击门时，它并没有添加，而是将其添加到了openArr数组中，但没有添加到localStorage中，我敢肯定我缺少了一些简单的东西，但是看不到！这是我的代码。

{{1}}

Answer 1

您要设置的值与您添加到本地存储中的值不同。

尝试这样的事情：

const openDoor = e => {
    e.currentTarget.parentElement.classList.add("opened");
    const newValue = [...openedArr, e.currentTarget.id];
    setOpenedArr(newValue);
    localStorage.setItem("openDoors", JSON.stringify(newValue));
  };

Answer 2

所有内容均以字符串形式保存在本地存储中。从本地存储保存/加载时，需要更新stringify / parse值。

...
const localData = JSON.parse(localStorage.getItem("openDoors"));
...
localStorage.setItem("openDoors", JSON.stringify(openedArr));

在清理本地存储后尝试上面的代码。一切都应该很好！

反应添加数组到localStorage

2 个答案: