在React JS（Redux）中是否有任何可能的方法来更新（同步）localStorage用于所有打开的选项卡（浏览器窗口）？

Question

我在React JS中遇到了有趣的问题。我用产品列表打开了我的应用程序的主页面。然后我选择了几个产品并在单独的选项卡（浏览器窗口）中打开它们。当我开始使用每个标签时，我的localStorage会更改（产品已添加到购物车），但仅限于我正在处理的当前页面。有没有办法在React JS（Redux）中为所有打开的选项卡（浏览器窗口）更新（同步）localStorage，而不仅仅是在当前页面上？

Answer 1

您希望使用 window.addEventListener（'storage'，function（）{}）添加事件侦听器，并使用setState或使用redux调度操作来更新应用程序状态

componentDidMount() {
  window.addEventListener('storage', this.handleStorageChange);
}

componentWillUnmount() {
  window.removeEventListener('storage', this.handleStorageChange)
}

handleStorageChange(storageEvt) {
  // setState or dispatch a redux action
  this.setState({
  });
}