如何在 React js 中监听 sessionStorage？

Question

我想听听SessionStorage中的每一个变化。 有没有办法在它改变时听它？ 我正在使用反应类。

class Module extends React.Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
    this.state = {
      ....
    };
  }


  handleClick(e) {
    const value = e.currentTarget.textContent;
    sessionStorage.setItem("AnyValue", value);
  }

  render() {
    return (
      <div
        onClick={this.handleClick}
      >
        {this.props.id}
      </div>
    );
  }
}

Answer 1

你可以做

componentDidMount() {
  window.addEventListener('storage', () => {
    console.log("CHANGED!!!");    
  });
}

记得卸载监听器

componentWillUnmount() {
  window.removeEventListener('storage');
}