Which statement is true about rendering a component with no children in JSX?

Which statement is true about rendering a component with no children in JSX?

• A. It must use a self-closing tag
• B. It must use an opening and closing tag
• C. It cannot render without children
• D. It can be rendered either as a self-closing tag or with an opening and closing tag

Answer: (D)

In JSX, you can render a component that has no children using either a self-closing tag or a standard opening-and-closing tag pair. They are functionally the same when there’s nothing between the tags: the children prop is simply empty. The self-closing form (<MyComponent />) is just a concise shorthand for the same thing as <MyComponent></MyComponent>. Which form you choose is a matter of style or project convention; it’s not required to use one over the other, and you can render without children in either way. If there were content between the tags, that content would become the children of the component.

In JSX, you can render a component that has no children using either a self-closing tag or a standard opening-and-closing tag pair. They are functionally the same when there’s nothing between the tags: the children prop is simply empty. The self-closing form () is just a concise shorthand for the same thing as . Which form you choose is a matter of style or project convention; it’s not required to use one over the other, and you can render without children in either way. If there were content between the tags, that content would become the children of the component.