I've been a professional C, Perl, PHP and Python developer.
I'm an ex-sysadmin from the late 20th century.
These days I do more Javascript and CSS and whatnot, and promote UX and accessibility.
Here, I am rendering short text (<p> tag) in the conditions to make the example short. But you are not limited to any specific html tag, you can render any html tag, even you can render another component.
Fragments don't render divs, they are a placeholder that renders nothing at all to the DOM, so the only thing rendered is what is returned by the functions etc.
I've been a professional C, Perl, PHP and Python developer.
I'm an ex-sysadmin from the late 20th century.
These days I do more Javascript and CSS and whatnot, and promote UX and accessibility.
I've been a professional C, Perl, PHP and Python developer.
I'm an ex-sysadmin from the late 20th century.
These days I do more Javascript and CSS and whatnot, and promote UX and accessibility.
Won't all of these render a
divregardless, though?Here, I am rendering short text (
<p>tag) in the conditions to make the example short. But you are not limited to any specific html tag, you can render any html tag, even you can render another component.Fragments don't render divs, they are a placeholder that renders nothing at all to the DOM, so the only thing rendered is what is returned by the functions etc.
So all these examples, which return a wrapper div with conditional content - does React strip out the empty div automatically?
<></>is a Fragment not a<div></div>, so nothing apart from the content is rendered.Ah, OP has updated the post. It used to use
<div>in all the examples.Ahhh!!! That explains a lot :)