Maria
Maria

Reputation: 43

What is <> In React JSX?


Just as the title, what does mean in React? Like this code below.

return (
 <>
   <h1> Just a simple header </h1>
 </>
);

Upvotes: 3

Views: 60

Answers (3)

petrch
petrch

Reputation: 1968

These are shortened syntax for code fragments https://reactjs.org/docs/fragments.html

...There is a new, shorter syntax you can use for declaring fragments. It looks like empty tags...

Upvotes: 0

tcf01
tcf01

Reputation: 1789

This is the short syntax of React.Fragment. However, be in mind that that it doesn’t support keys or attributes. If you wanna add key or attributes. You should use back the original syntax

<React.Fragment myOwnProps={...sth} key={...otherThing}>
      <div>...</div>
</React.Fragment>

Check this out

Upvotes: 0

Roy.B
Roy.B

Reputation: 2106

React fragment https://reactjs.org/docs/fragments.html

it's just a shortened syntax

This:

return (
    <React.Fragment>
      <ChildA />
      <ChildB />
      <ChildC />
    </React.Fragment>
  );

Equal to this:

return (
    <>
      <ChildA />
      <ChildB />
      <ChildC />
    </>
  );

Upvotes: 3

Related Questions