javascript - 带有 react-redux 的 LocalStorage

Question

我正在为我的 SPA 使用 React 和 Redux，我想在本地存储一些数据。而且我需要同步appState和localstorage，这样刷新页面后我的数据就不会丢失了。

我是 React 和 Redux 的新手，不太了解发生了什么，但我认为 Redux 为我创建了整个应用程序的状态，所以我不能只将我的状态与应用程序组件中的本地存储绑定(bind)因为它只是组件的状态，而不是我的应用程序的状态。

Answer 1

我建议使用以下命令将数据存储在本地存储中。

设置localStorage中的数据可以通过命令完成:

localStorage.setItem('nameForData', variableNameForData);

在需要时检索数据。

var variableNameForData = localStorage.getItem('nameForData')

从本地存储中删除数据:

localStorage.removeItem('nameForData')

这些通常会被放入 action creators 中，并进行调度以更改某些 bool 值的状态，这些 bool 值跟踪应用程序与 localStorage 的交互。

例如，您可能有一个在创建本地存储时设置为 true 的状态。

刷新时，您可能会调用检查本地存储是否存在的 Action 创建器，如果它确实将该 bool 值设置回真，或者如果它不存在，您将返回创建本地存储，然后将其设置为真。

您可以将此函数放在 componentWillMount(){} 中，它将在组件首次呈现时调用，因此在刷新的情况下。

Docs for component life cycle and specifically componentWillMount here

Docs for local storage here