javascript - 在 React 组件中收听 window.onmessage

Question

我正在尝试在我的 React 课上收听 postmessage。它不起作用。

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', '*');

我知道消息正在到达窗口，因为我可以在加载 React 应用程序的纯 JS 文件中成功收听它。然而，在上面的 react 中听它是行不通的。
为什么我的监听器不是每次都被触发，我该如何调试它？

Answer 1

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

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

见: The dispatched event