如何使用 Ngrx 保存到本地存储？

Question

我正在尝试将一个简单的菜单状态保存到浏览器 localStorage，无论它是 'open' 还是 'close'。我知道我可以使用 localStorage.setItem 来完成。但是，我的项目正在使用 NGRX。使用 NGRX 有更好的方法来处理这个问题吗？默认情况下，菜单是打开的。如果我关闭它并关闭浏览器然后 return 回来，它应该被关闭。

有没有办法使用 NGRX 或 localStorage 是更好的解决方案？我正在学习 NGRX。感谢任何帮助。

Answer 1

不确定什么是最好的。但对我来说 NGRX 有点大，它可能需要这么多 setting/initializing 代码。当我在做简单的任务或功能时我不使用 NGRX，我认为很多任务和需求可以通过 localStorage、Service、Observable 来处理。不过想学NGRX也没关系

Answer 2

您可以创建一个您在初始状态下设置的函数，该函数可以从本地存储中提取数据

StoreModule.forRoot(
    { someReducer: reducer },
    { initialState: getInitialAppState }
  ),

然后在函数中你可以做这样的事情

export function getInitialAppState() {
    const previousSettings  = localStorage.getItem("settings")
    if (previousSettings  != null) {
         return JSON.parse(previousSettings);
    }
    return {};
}

因此，如果您在之前的设置中的某一点存储了一些设置，它会将其设置为初始状态。要存储这些设置，您可以在 app.component 或某个更适合设置列表的地方有一个选择器，并且只是 JSON.stringify 您要存储的状态。

如何使用 Ngrx 保存到本地存储？

How to save to local storage using Ngrx?

state-management

local-storage

ngrx

angular