Why to use React.Fragment in React ?

As per react pattern, whenever a component render multiple child elements it should be enclosed in a single root element otherwise it will give an error.

To solve this issue we generally use something like

But the problem with above approach is , if we observe this by inspecting the web page we see one <div> as root element but we are not using anywhere of that <div>. un-necessarily we added one extra node to DOM .

To overcome this issue React Fragment is used. It doesn’t add extra node to DOM

To simplify The above thing it will also be write as ,

Below is the complete example with best practice to use

Related posts:

To make success in today’s business, digital presence plays a very vital role. It helps to reach millions of people in a short span of time and makes one’s life easier and become stronger and…

Ya puedes descargar el número 587 de la Revista Alma Mater, en el encontraras entrevistas y crónicas y otros artículos que serán de tu agrado como humor, ciencia y tecnología, deportes…

With an enticing Mediterranean-style climate, thriving entrepreneurial culture, and emerging-market opportunities, relatively low cost of living, vibrant capital and beautiful countryside — not to…