Skip to content

Portal API

The API documentation of the Portal React component. Learn more about the props and the CSS customization points.

Import

import Portal from '@material-ui/core/Portal';
// or
import { Portal } from '@material-ui/core';

You can learn more about the difference by reading this guide.

Portals provide a first-class way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.

Props

Name Type Default Description
children node The children to render into the container.
container HTML element
| func
A HTML element or function that returns one. The container will have the portal children appended to it.
By default, it uses the body of the top-level document object, so it's simply document.body most of the time.
disablePortal bool false The children will be inside the DOM hierarchy of the parent component.

The component cannot hold a ref.

Demos