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 的效果如下:

      1. 保留输入中的换行符。
      2. 允许长内容自动换行(减少水平滚动条)。

例如:
输入的内容 "12312\\n123132" 会渲染为:

12312
123132
添加新评论