0 day streak
javascript / beginner
Snippet

The 'children' Prop for Composition

The 'children' prop is a special prop that automatically passes any content nested between a component's opening and closing tags. It is essential for creating wrapper components.

snippet.js
javascript
1
2
3
4
5
6
7
8
function Card({ children }) {
return <div className="card-container">{children}</div>;
}
// Usage:
<Card>
<p>This is inside the card!</p>
</Card>
react
Breakdown
1
function Card({ children }) {
Destructures the 'children' prop from the props object.
2
{children}
Renders whatever content was placed inside the <Card> tags.