使用 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