javascript - 如何替换字符串中的 \n 换行符，以便标签可以显示新行

Question

在我正在处理的反应应用程序中，有一个条件：

当一个字符串有一个换行符时

<p>{string}</p>要显示字符串的标记应替换为 HTML 换行符。

但这当然行不通。

我已经尝试过但对我不起作用的事情：

const string = Hello\nHii

1. <p>{string.replace('\n', <br />)}</p>

输出：

Hello<br />Hii

2. <p>{string.replace('\n', &amp;)}</p>

输出：

Hello Hii

我在以下答案中找到了上述建议：

textarea 的 val 不考虑换行

标签： javascripthtmlreactjs

Answer 1

有两种选择。

1. 使用pre标签或 css 属性white-space: pre：

   <p><pre>{string}</pre></p>

2. 使用危险的SetInnerHTML：

   <p dangerouslySetInnerHTML={{__html: string.replace('\n', '<br />')}}></p>