反转存储在localStorage中的布尔值

Question

我有一个可以切换黑暗模式的按钮。 我将暗模式状态作为Boolean存储在localStorage中。

按钮调用此函数，该函数应翻转布尔值， 但它不起作用。

const handleDarkMode = () => {
  let darkMode = localStorage.darkMode
  localStorage.setItem("darkMode", !darkMode)
}

有什么想法吗？

Answer 1

本地存储中的项目以字符串形式存储，因此您需要先将"true" / "false"值转换为true / false（布尔值），然后才能使用darkMode作为布尔值：

const handleDarkMode = () => {
  let darkMode = localStorage.darkMode === "true"; // change "true" to true and others to false
  localStorage.setItem("darkMode", !darkMode)
}

还请注意：通常，要从localStorage中获取商品，我们使用getItem(key)

Answer 2

LocalStorage将Boolean转换为String，因此您需要像这样进行检查。

urljoin