CODEWITHSUNDEEP
javascriptreactjs
koko ka
koko ka

Reputation: 117

how to make a new line for react

Refer to the code below:

<item
     itemName={"laptop"}
     itemDescription={"- XXXX \n - PPPP"}    // how could I make a new line for this?
/>

\n is not working at this

Upvotes: 1

Views: 8838

Answers (1)

Dvid Silva
Dvid Silva

Reputation: 1162

You can do something like this:

 {text.split(“\n”).map(function(item) {
    return (
       {item}
       <br/>
    )
 })}

In your particular case it would look like this:

 itemDescription={<>XXXX <br /> - PPPP</>}

If your component takes nodes in that property, and not a string.

React doesn't use strings to create the HTMl, and HTML ignores line breaks, so you need to turn that string into JSX with line breaks, or paragraphs.

Upvotes: 4

Related Questions