Javascript 尝试用React将文本分成两行

我正在尝试使用React将文本分成两行，但它不起作用\n 这是我的文本 段落：“比以往任何时候都更快地完成任务。有了我们的平台，只需几分钟。”

我想变成这样： 段落：“比以往更快地完成任务。 有了我们的平台，只需几分钟。”

---

但是使用\n不起作用，还有其他解决方案吗？

如果可能的话，您可以添加

html标记

如果可能的话，您可以添加

html标记

如果您想要“\n”起作用，您需要添加css属性样式={whiteSpace:“pre line”}

函数ReactApp（）{
const text=“以前所未有的速度完成任务。\n使用我们的平台，只需几分钟。”
返回(
{text}
)
}

如果希望“\n”起作用，则需要添加css属性style={{{whiteSpace:“pre-line”}

函数ReactApp（）{
const text=“以前所未有的速度完成任务。\n使用我们的平台，只需几分钟。”
返回(
{text}
)
}

我建议使用样式而不是内容驱动来解决这个问题。如果减少

div

元素的宽度，默认情况下文本将中断。

我建议使用样式而不是内容驱动解决此问题。如果减小

div

元素的宽度，文本将默认中断。

将它们拆分为单独的

标记，或者在元素之间放置一个

标记。
将它们拆分为单独的
标记，或者在元素之间放置一个

标记，.
最好的方法是将文本放入单独的容器中（例如div）

最后，您可以尝试使用
空白：pre-line
属性

e、 g

然后在渲染中执行以下操作：

render() {
   return <div className="break-line">Complete tasks faster than ever before. \n With our platform, it only takes minutes</div>
}

render（）{
返回完成任务的速度比以往任何时候都快。\n使用我们的平台，只需几分钟
}

它应该能完成任务。如果有任何问题，请不要犹豫！您可以在此处阅读有关空白属性的更多信息：
最好的方法是将文本放入单独的容器（例如div）中

最后，您可以尝试使用
空白：pre-line
属性

e、 g

然后在渲染中执行以下操作：

render() {
   return <div className="break-line">Complete tasks faster than ever before. \n With our platform, it only takes minutes</div>
}

render（）{
返回完成任务的速度比以往任何时候都快。\n使用我们的平台，只需几分钟
}

它应该能完成任务。如果有任何问题，请不要犹豫！您可以在此处阅读有关空白属性的更多信息：
将文本像span一样包装：

<span>Your Text</span><br>
<span>Next Text</span>

您的文本

下一个文本
将文本以span格式包装，如：

<span>Your Text</span><br>
<span>Next Text</span>

您的文本

下一个文本
一般来说，在编译react应用程序/通过浏览器解析时，依靠保留的空白不是一个好主意。像多个空格和换行符这样的东西通常在到达浏览器之前压缩为单个空格。说来话长：我建议选择一个使用布局元素和/或CSS的答案，而不是
\n
和空白格式。一般来说，在编译react应用程序/通过浏览器解析时，依靠保留空白不是一个好主意。像多个空格和换行符这样的东西通常在到达浏览器之前压缩为单个空格。说来话长：我建议选择使用布局元素和/或CSS的答案，而不是使用
\n
和空白格式。