ReactDOM.createPortal

ReactDOM. createPortal (child, con ta iner) Portal 将提供一种将子节点渲染到 DOM 节点中的方式，该节点存在于 DOM 组件的层次结构之外。 因此 Portals 适合脱离文档流 (out of flow) 的组件，特别是 position: absolute 与 po sition: fixed的组件。
例如：自定义弹窗等

import React, { useEffect } from "react";
import { createPortal } from "react-dom";
const CreatePortal = (props) => {
  const el = document.createElement("div");
  useEffect(() => {
    el.setAttribute("id", "portal");
    document.body.appendChild(el);
    return () => {
      document.body.removeChild(el);
    };
  }, []);
  return createPortal(props.children, el);
};
export default CreatePortal;

浏览器输出:

portal 挂载在任意节点上
注意：使用StrictMode 会报错 portal 会执行两次 https://juejin.cn/post/7036380015365193735