Home > @lynx-js/react > createPortal

#createPortal() function

Renders vnode into container instead of the current component's position in the element tree, while keeping it in the React tree.

container is a NodesRef, obtained either from a callback ref or from lynx.createSelectorQuery().select(...).

Signature:

export declare function createPortal(vnode: ComponentChild, container: NodesRef): ReactNode;

#Parameters

Returns:

ReactNode

A ReactNode placeholder to include in the JSX at the call site; the rendered output goes into container.

#Remarks

Context still flows across the portal boundary, and state updates inside the portal behave like they do in any other component. A few behaviors differ from react-dom:

• Events do not bubble along the React tree. ReactLynx follows Preact's approach, which has no synthetic event system, so events follow the actual element structure of the page. - The portaled subtree renders on the background thread only, and does not participate in main-thread first-screen rendering. - Mounting across pages or across native containers is not supported.