javascript - 在 React Component 中监听 window.onmessage

Question

我正在尝试在我的反应课程中收听帖子消息。它不工作。

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.handleMessage = this.handleMessage.bind(this);
  }
  componentDidMount(){
    window.addEventListener("onmessage", this.handleMessage);
  }
  componentWillUnmount() {
    window.removeEventListener('onmessage', this.handleMessage);
  }
  handleMessage(e){
    console.log('me?')
  }
}

我这样发送消息：

window.opener.postMessage('a message', '*');

我知道消息正在到达窗口，因为我可以在加载反应应用程序的纯 JS 文件中成功收听它。但是，在上面的反应中听它不起作用。

为什么我的监听器不是每次都被触发，我该如何调试它？

标签： javascriptreactjs

Answer 1

事件的名称应该是message而不是onmessage：

 window.addEventListener("message", this.handleMessage);

请参阅：已调度的事件