How to add a line break in JavaScript array?

Question

I'm looking to add a line break to the following array. Using \n doesn't seem to work.

const output = {
  message: [
      `Hello world\n Hello again!`
    ]
}

Is there a way to add line breaks in arrays? I tried mapping through the array and adding some HTML but didn't have much success there as I couldn't figure out how to separate the "Hello World" and "Hello again" messages:

const displayOutput = output.message.map((messages, id) =>
      <p key={id} className="output-message">
        {messages}
      </p>
 );

Thanks for any help!

newline characters are not shown as new lines when put in html, use a `
` or css styling — Patrick Evans, Mar 18 '21 at 00:15
Or something more React-specific, e.g. https://stackoverflow.com/q/50229792/3001761. — jonrsharpe, Mar 18 '21 at 00:19
Line breaks `\n` are ignored by HTML without some specific CSS. https://stackoverflow.com/questions/39325414/line-break-in-html-with-n — evolutionxbox, Mar 18 '21 at 10:28

score -2 · Answer 1 · answered Mar 18 '21 at 00:16

-2

You are using a template literal, which means that linebreaks are defined by actually making a newline in the string itself.

answered Mar 18 '21 at 00:16

olawrdhalpme

180
8

Line breaks `\n` are ignored by HTML without some specific CSS. – evolutionxbox Mar 18 '21 at 10:28

How to add a line break in JavaScript array?

1 Answers1