打开的窗口关闭后如何在React中触发事件

时间:2018-12-05 04:56:08

标签: javascript reactjs window

我在React中有一个div,它带有一个onClick处理程序,当单击该处理程序时,它会在将它们定向到外部URL的弹出窗口中实现window.open。当用户关闭弹出窗口时,我想实现一个API调用。但是,我尝试过的所有操作都失败了,包括尝试使用事件侦听器。

如何在React中检测何时关闭窗口?

我对window事件的当前代码如下:

export class App extends Component {

  opener = () => {
    const myWindow = window.open("https://www.espn.com", "MsgWindow", "width=200,height=100");
  }

  render() {  

    return (
      <div onClick={this.opener}>
        Hello World
      </div>
    );
  }
}

1 个答案:

答案 0 :(得分:2)

您可以如下更改opener函数:

  opener = () => {
    const myWindow = window.open("https://www.espn.com", "MsgWindow", "width=200,height=100");

    var timer = setInterval(function() { 
        if(myWindow.closed) {
            clearInterval(timer);
            alert('closed');
        }
    }, 1000);
  }

Reference | Codepen