会话存储侦听器仅适用于手动更改

Question

我有一个应用程序，我想在sessiontorage中存储一个bool值，该值指示用户是否登录。该布尔值将被监听，并且每当更改时，app组件中的状态应更改为sessionstorage变量的值。

为完成此任务，我添加了一个窗口事件监听器，该监听器应跟踪sessionstorage的更新，然后更改状态。这不能通过storage.setItem（）起作用。但是，当我通过chrome开发人员工具更改了本地存储中的值时，它就起作用了。这意味着，以某种方式聆听是有效的。

componentDidMount(){
    if (typeof window !== 'undefined') {
      let isTrue = (sessionStorage.getItem('loggedIn') === 'true');
      this.setState({loggedIn: isTrue});
      window.addEventListener('storage', this.sessionStorageUpdated)
    }
  }

  sessionStorageUpdated() {
    console.log("storage updated");
    let isTrue = (sessionStorage.getItem('loggedIn') === 'true');
    console.log(isTrue);
    if (isTrue) {
      this.setState({loggedIn: true})
    } 
    else {
      this.setState({loggedIn: false})
    }
  }

  componentWillUnmount(){
    if (typeof window !== 'undefined') {
        window.removeEventListener('storage', this.sessionStorageUpdated)
    }
  }

我希望如果sessionstorage更新了，状态也会改变，但这不会发生。但是，如果我直接更改开发工具中的值，它确实可以工作。