html显示原始换行
使用 white-space
的 CSS 样式
可以用 CSS 的 white-space
属性来实现换行符的显示。
具体代码:
export default function Display({ content }) {
return (
<div style={{ whiteSpace: "pre-wrap" }}>
{content}
</div>
);
}
解释:
white-space: pre-wrap
是一种 CSS 样式,能够保留换行符和空格,并根据需要自动换行。pre-wrap
的效果如下:- 保留输入中的换行符。
- 允许长内容自动换行(减少水平滚动条)。
例如:
输入的内容 "12312\\n123132"
会渲染为:
12312
123132