设置localStorage的值是否有副作用？

Question

我正在开发一个React + Redux应用程序，该应用程序必须将商店中的某些值保存到localStorage 。 我有一些实用程序功能，可以安全地将值存储到localStorage 。 我有一个动作（重击）和减速器。

const wallet = (state = getFromLocalStorage('wallet'), action) => {
  switch(action.type) {
    case 'SET_WALLET':
      setToLocalStorage('wallet', action.payload); // <--- **SIDE EFFECT?**
      retrun action.payload;
    default:
      return state;
  }
}

减速器必须是纯函数。 getToLocalStorage函数调用是否破坏了reducer的纯度？ 如果是这样，在什么地方调用此函数？

Answer 1

这绝对是FP术语的副作用，但实际上您的代码没有什么不好。 除了可能有redux / flux之外，没有其他更好的解决方法可以在组件之间（甚至在react.js树之外）共享状态。

函数式编程是一件好事，但您无需将其变成邪教

Answer 2

正如另一条评论所述：是的，这绝对是副作用。 现在，在这种情况下它可能不会损坏任何东西，但是减速器不是这样做的正确位置。

更好的解决方案是在商店订阅回调或中间件中执行此操作。 或者，甚至更好的方法是，使用已有的许多商店持久性库之一 。 进行大批量存储也可以接受，特别是如果您只想保留少量数据而不是整个存储状态时，尤其如此。