React.Fragment groups sibling elements when React requires one parent element, without adding a corresponding DOM element or HTML output. This avoids the extra wrapper that a <div> would create. section 2.3.3
Group a heading and link
Use the Fragment component when rendering multiple elements together: `const group = React.createElement(React.Fragment, null, title, link);` The heading and link render as siblings, while the Fragment itself does not appear in the HTML. section 2.3.3
In JSX, choose between the explicit component and its shorthand:
- Use `<Fragment>...</Fragment>` after importing `Fragment` from React when the fragment needs properties such as `key`. section 3.2.9
- Use `<>...</>` for ordinary fragments when no attributes or properties are needed. section 3.2.9
- Use a keyed Fragment when mapping data to multiple sibling elements, such as each `<dt>` and `<dd>` pair in a definition list. section 3.2.9
