React - JSX - how to keep regext /r/n that come from API?

Question

I am need to render such strings that come from API. They arrive to the component in a similar form:

console.log(companyName) // Company Name/r/n/Address 123/r/n/1234 City/r/n/ Country

However when I use that variable in the component the regex is removed and all is displayed in one line:

`<div>{companyName}</div>` renders in one line as `Company Name Address 123 1234 City Country`

How can I keep the "next line" regex instructions so that the text will be displayed as:

Company Name
Address 123 
1234 City Country

Thank you

Answer 1

You can convert companyName variable and render it like this:

companyName.replaceAll("/r", "").split("/n").map(item => <div key={item}>{item}</div)