Question Bank
/

React Portals: Two Explanations Quiz

React Portals: Two Explanations Quiz

Two explanations of React portals (mechanics and use cases, plus event bubbling through the virtual tree) with companions on a Modal implementation and a portal-aware focus trap.

Question Bank
Hard
JavaScript
quiz
react
js-dom
interview-prep

844 views

23

Explain what createPortal(child, container) does, why it exists, and list two concrete UI patterns where reaching outside the parent DOM hierarchy is necessary.

Examples

Example 1:

Input:
import { createPortal } from 'react-dom';
return createPortal(<p>Modal body</p>, document.body);
Output: <p>Modal body</p> renders as a direct child of <body>, not as a child of the React parent's DOM node.
Explanation: the React tree position is preserved (events still bubble through the React parent) but the DOM position is wherever `container` points.

3 more questions, with full solutions and explanations, are available for premium members.

Upgrade to Premium