[]previous and next page

Portal

<Portal mount={element}>children</Portal> renders its children into another element, without a wrapper.

For agentsUpdated

<Portal mount={element}>children</Portal> renders its children into another element, without a wrapper. The default mount is document.body. mount may be an element or a function returning one (read reactively; changing it moves the content, and static nodes keep their identity). useShadow puts the content in a shadow root of the mount, created once.

  • Nothing is left at the call site and nothing is rendered on the server.
  • Disposing the portal's owner removes exactly the nodes it inserted; nodes that were already in the mount stay.
  • Delegated events (onClick, onInput, ...) fire for content inside the portal. Handlers on elements that wrap the Portal call site do not fire, because the DOM tree, not the component tree, decides propagation.
  • A missing or null mount renders nothing and logs one development warning, PORTAL_TARGET_MISSING.