从React状态在本地存储中存储符号加载为“未定义”

Question

我正在使用localStorage在React Todos应用程序中实现缓存。我进行了App.js的设置，以便将所有数据存储在localStorage中组件状态下的数据中，然后在您下次访问该页面时加载它，这仅适用于一件事。

我将其范围缩小为以下事实：状态不正确的事物是一个枚举，定义为以下项之一：

const TodoFilter = Object.freeze({
  filterCompleted: Symbol("filterCompleted"),
  filterUncompleted: Symbol("filterUncompleted"),
  all: Symbol("clearFilter")
})

...，为了将内容存储在localStorage中，我正在使用JSON.stringify并使用JSON.parse加载它们。

如何使用localStorage存储/加载符号？我已经读过here，该符号上的JSON.stringify是按设计返回undefined的。有什么已知的解决方法可以让我将Symbol转换为其他符号，然后在JSON.parse之后将其导航到页面时将其取消转换？还是有比使用JSON更好的方法来将这些东西存储在localStorage中？ JavaScript不是我的母语，所以我对使用JavaScript的枚举或JavaScript如何处理JSON不太熟悉。