reactjs - 在 React 渲染元素中保留空间

Question

从我的后端服务返回一个包含空格的字符串。当我console.log在我的方法中使用这个值时，render它会显示带有空格的原始字符串。

但是，渲染的元素缺少值。

例子：

const a = "I am a text string"

不同于：

const a = "I  am a text string"

（注意“I”和“am”之间的额外空格。

渲染方法似乎正在从我的渲染输出中删除额外的空间。

这只是一个示例，但我尝试向最终用户展示的原始数据必须包含额外的空间。如何强制 React 呈现原始字符串，而不是对其进行某种文本格式设置？

标签： reactjs

Answer 1

我不确定 React JS 是否会因为它只是 HTML 而弄乱空间。在元素上使用以下 CSS：

white-space: pre-wrap;

工作演示： wmnk7rmq8 - CodeSandbox