React Props Children

React Props Children

In React, props.children is an incredibly powerful special prop that allows you to pass components or elements directly inside other components, behaving much like standard wrapper HTML elements.

Using children

When you nest content inside a component's opening and closing tags, that exact content is automatically passed down to the component implicitly as the children prop.

function Card({ children }) {
  return <div className="card">{children}</div>;
}

function App() {
  return <Card><h2>Title</h2><p>This is the body.</p></Card>;
}