portals——React (二)

Portal 提供了一种将子节点渲染到存在于父组件以外的 DOM 节点的优秀的方案

ReactDOM.createPortal(child, container)

第一个参数(child)是任何可渲染的 React 子元素; 例如一个元素,字符串或 fragment
第二个参数(container)是一个 DOM 元素

使用场景:
父组件有 overflow: hidden 或 z-index 样式时,但你需要子组件能够在视觉上“跳出”其容器
例如,对话框、悬浮卡以及提示框

render() {
  // React 并*没有*创建一个新的 div。它只是把子元素渲染到 `domNode` 中。
  // `domNode` 是一个可以在任何位置的有效 DOM 节点。
  return ReactDOM.createPortal(
    this.props.children,
    domNode
  );
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容