Javascript React门户弹出窗口变量

我目前正在尝试使用

ReactDOM.createPortal

创建一个弹出窗口。 我已经经历过了 并使用以下代码

class Window extends React.Component {
  constructor(props) {
    super(props);
    this.state = { win: null, el: null };
  }

  componentDidMount() {
    let win = window.open('', '', 'width=600,height=400');
    win.document.title = 'A React portal window';
    let el = document.createElement('div');
    win.document.body.appendChild(el);
    this.setState({ win, el });
  }

  componentWillUnmount() {
    this.state.win.close();
  }

  render() {
    const { el } = this.state;
    if (!el) {
      return null;
    }
    return ReactDOM.createPortal(this.props.children, el);
  }
}

主要问题是

this.props.children

可以包含将事件处理程序注册为的组件

而

windows

变量仍然指的是主窗口，而不是最近打开的弹出窗口

我想计算弹出的X&Y。 我不想将

this.state.win

传递给新的子级，因为它们可以包含库组件，这些组件直接调用

window.screenX

你知道变通办法吗