在 React JSX 文本区域内添加换行符答案

【问题标题】：Add break line inside React JSX textarea在 React JSX 文本区域内添加换行符
【发布时间】：2021-03-12 14:28:08
【问题描述】：

我正在尝试在 textarea 内打印的数组映射中添加断线，它工作正常，但是一旦我收到邮件，断线不再显示，我的所有文本都在一行中。

 const product = cartItems.map((item) => item.name + item.sub).join("\r\n");

 <textarea
   type="text"
   id="product"
   name="product"
   value={product}
   readOnly
   required
 />

我在 textarea 中的输出是正确的，如下所示：

Name Sub
Name Sub
Name Sub

但是当我发出邮件时，打印的是：

Name Sub  Name Sub  Name Sub

感谢您的帮助。

【问题讨论】：

标签： javascript reactjs input textarea break

【解决方案1】：

怎么样

const product = cartItems.map((item) => item.name + item.sub).join("\r\n");
<>
<textarea
type="text"
id="product"
name="product"
value={product}
readOnly
required
/>
<br/>
</>

只是放一个物理换行符？

【讨论】：

感谢您的回复，但换行符不起作用，并且它在 textarea 内容之外，值应该有换行符。