Jose Cabrera Zuniga
Jose Cabrera Zuniga

Reputation: 2615

How to enter comments in React: What is the equivalent of html <!-- -->?

In html to create a comment we use:

  <!-- Write your comments here -->

What is its equivalent in React while using React components in the return section of a react component? Sometimes I just want to place some comments like

   <!-- <MyComponent .... /> -->

but I can not do it in this way

Upvotes: 5

Views: 6022

Answers (6)

Islam Alshnawey
Islam Alshnawey

Reputation: 852

write comments as you might do in HTML and XML with <!-- --> syntax. will throw Unexpected token error.

To write comments in JSX, you need to use JavaScript’s forward-slash and asterisk syntax, enclosed inside a curly brace {/* comment here */}.

Here’s the example:

export default function App() {
      return (
        <div>
          <h1>Commenting in React and JSX~ </h1>
          {/* <p>My name is Bob</p> */}
          <p>Nice to meet you!</p>
        </div>
      );
}

Ref

Upvotes: -1

Miodrag Trajanovic
Miodrag Trajanovic

Reputation: 134

But comment can add and to return part of class with {/* coments*/}. This away can get possibility write comments to more lines, like is can write comments to Java, C++, Javascript

Upvotes: 0

Miodrag Trajanovic
Miodrag Trajanovic

Reputation: 134

Can add comment in React code on the one line

// comment

Comment in other place than is html tags for more rows

/* comments*/

Upvotes: 1

Hemadri Dasari
Hemadri Dasari

Reputation: 33984

As mentioned in comments. You can write comments in React like below

  { /* <MyComponent .... /> */ }

Upvotes: 1

Bernardo Siqueira
Bernardo Siqueira

Reputation: 414

You have to wrap in curly braces, and then block comment: {/* <div /> */}

Upvotes: 2

Rose Robertson
Rose Robertson

Reputation: 1256

You cannot do regular HTML comments in jsx, the closest you can get is JS-style comments -

{/* This is a comment */}

Upvotes: 7

Related Questions