The Road to React: The One with Hooks/

...

/

React Fragments

React Fragments

Learn how the React component returns multiple elements.

We'll cover the following...

One caveat with JSX, especially when we create a dedicated Search component, is that we must introduce a wrapping HTML element to render it:

Node.js
const Search = ({ search, onSearch }) => (
 <div>
   <label htmlFor="search">Search: </label>
   <input
     id="search"
     type="text"
     value={search}
     onChange={onSearch}
   />
 </div>
);

Normally the JSX returned by a React component needs only one wrapping top-level element. To render multiple top-level elements ...