如何在React JS中的字符串组件中插入换行符？

function App() {
  return (
    <div>
      这是第一行。<br />
      这是第二行。
    </div>
  );
}

function App() {
  const text = "这是第一行。\n这是第二行。";
  return (
    <div>
      {text.split('\n').map((line, index) => (
        <React.Fragment key={index}>
          {line}
          <br />
        </React.Fragment>
      ))}
    </div>
  );
}

function App() {
  const text = "这是第一行。\n这是第二行。";
  return (
    <div style={{ whiteSpace: 'pre-line' }}>
      {text}
    </div>
  );
}

function App() {
  const text = "这是第一行。\n这是第二行。";
  return (
    <div>
      {text.split('\n').map((line, index) => (
        <div key={index}>{line}</div>
      ))}
    </div>
  );
}