Prop Drilling Cleanup
ReactJS
Hard
6 views
Problem Description
Refactor a deep tree to pass only the props needed (no extra props).
Output Format
Render a React component.
Constraints
Use small components and pass minimal props.
Official Solution
import React from 'react';
function Title({ text }) {
return <h1 style={{ margin: 0 }}>{text}</h1>;
}
function Subtitle({ text }) {
return <p style={{ margin: '8px 0 0 0', color: '#555' }}>{text}</p>;
}
function Header({ title, subtitle }) {
return (
<header style={{ border: '1px solid #eee', borderRadius: 14, padding: 14, width: 480 }}>
<Title text={title} />
<Subtitle text={subtitle} />
</header>
);
}
export default function App() {
return <Header title='meetcode' subtitle='Practice small questions daily.' />;
}
Solutions (0)
No solutions submitted yet. Be the first!
No comments yet. Start the discussion!