What is fragment in react?

fragment is a component in react, its role is to replace div as the outer layer, and it can be used as an invisible wrapping element. When defining a component, the return return requires a unique root element, so a div is often written to wrap it, but if you don’t want to render this div and reduce dom rendering, you can refer to the Fragment component.

Recommended tutorial: “React Video Tutorial”

fragment is a component in react, which is used to replace div as the outer layer. Make invisible wrapping elements.

A component in React often returns multiple elements. At the same time, React requires that these elements must be wrapped under one element. The most common way is to use wrapping. The problem with this is that a lot of unnecessary nesting is added, which virtually increases the rendering pressure of the browser.

From react 16, render supports returning an array:

import React from 'react';
 
 export default function () {
     return [
         step 01,
         step 02,
         step 03,
         step 04
     ];
 }

At the same time, another method is provided, which is Fragments.

When we define a component, the return return requires a unique root element, so we often write a div to wrap it. If we don’t want to render this div and reduce dom rendering, we can refer to the Fragment component.

import React from 'react';
 
 export default function () {
     return (
         
             step 01
             step 02
             step 03
             step 04
         
     );
 }

For more knowledge about programming, please visit: Introduction to Programming! !

The above is what is fragment in react? For more details, please pay attention to other related articles on 1024programmer.com!