2015-09-02 44 views
6

我有一个弹出窗口的OAuth进程,但是当我登录时,重定向到OAuth回调页面会在弹出窗口而不是父窗口(window.opener)内发生。这可能有点不方便,但我想要一个弹出窗口告诉父母“我们是授权的!”的方式。在弹出窗口与父窗口通信的任何方法?

这其实工作原理:

OAuthCallback = React.createClass({ 
    displayName: 'OAuthCallback', 

    render() { 
    window.opener.console.log('hello parent window'); 

    return (
     <div> 
     Hi, OAuth is process is done. 
     </div> 
    ) 
    } 
}); 

但我不知道是否有一些方法可以让我有弹出窗口告诉父窗口调用一个道具的功能,例如this.props.oauthSucceeded()

回答

10

当您无法在组件之间建立任何父子关系或兄弟关系时,React建议设置一个事件系统。

对于两个组件之间的通信是没有 父子关系,你可以建立自己的全球盛会 系统。订阅componentDidMount()中的事件,在 componentWillUnmount()中取消订阅,并在收到事件时调用setState()。通量模式是安排这种情况的可能方法之一。

看到https://facebook.github.io/react/tips/communicate-between-components.html

看一看window.postMessage跨窗口通信(https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

+1

虽然这超出了事件系统,但我正在谈论一个访问父窗口组件的弹出窗口,它实际上处于完全不同的状态集合中。 – ffxsam

+1

它仍然可以通过跨窗口设置事件监听器进行通信,编辑我的答案。 – Eelke

+0

这个回答非常有帮助,谢谢! – ffxsam

相关问题