Render Only When Needed
ReactJS
Easy
6 views
Problem Description
Create a component that returns null when there is nothing to show.
Output Format
Render a React component.
Constraints
Keep the parent markup clean.
Official Solution
import React from 'react';
function Hint({ text }) {
if (!text) return null;
return <div style={{ marginTop: 8, color: '#555' }}>{text}</div>;
}
export default function App() {
return (
<div style={{ padding: 16 }}>
<strong>meetcode</strong>
<Hint text='' />
<Hint text='Tip: start with easy questions.' />
</div>
);
}
Solutions (0)
No solutions submitted yet. Be the first!
No comments yet. Start the discussion!