Portals

Portals基本使用

import React from 'react';
import ReactDOM from 'react-dom'
class Modal extends React.Component {
  render() {
    return ReactDOM.createPortal(
      this.props.children,
      document.getElementsByTagName('body')[0]
    )
  }
}
class App extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div id={'app'}>
        <Modal>
          <h1>我将会渲染到body元素下</h1>
        </Modal>
      </div>
    )
  }
}
export default App;

•  props.children 包含组件的开始标签和结束标签之间的内容
•  ReactDOM.createPortal 函数接收两个参数，需要渲染的内容和将内容渲染到什么地方去