Which JSX forms are valid for rendering a React component?

Which JSX forms are valid for rendering a React component?

• A. Both <MyComponent /> and <MyComponent></MyComponent>
• B. Self-closing tag only
• C. Opening tag only
• D. Neither

Answer: (A)

In JSX you can render a React component using either a self-closing tag or an opening/closing tag. The self-closing version is just a shorthand for having no children. If you put content between the tags, that content becomes the component’s children prop. So both forms render the component the same way when there are no children. If you want to pass something inside, you’d use the paired form, and inside the component you can render that content via props.children. For example, <MyComponent /> and <MyComponent></MyComponent> are equivalent when there’s nothing inside, while <MyComponent>Some content</MyComponent> passes that content as children.

In JSX you can render a React component using either a self-closing tag or an opening/closing tag. The self-closing version is just a shorthand for having no children. If you put content between the tags, that content becomes the component’s children prop. So both forms render the component the same way when there are no children. If you want to pass something inside, you’d use the paired form, and inside the component you can render that content via props.children. For example, and are equivalent when there’s nothing inside, while Some content passes that content as children.