如果目标是将项目列表缩减为呈现为多行字符串的单个字符串，则可以使用white-space:pre-wrap; CSS规则来实现此目的：

body {
  white-space: pre-wrap;
}

一旦你完成了这一步，你应该能够呈现一个多行字符串，在\n字符上有换行符，如下所示：

export const showPeople = (peopleArray = []) => {

  let peopleString = peopleArray ? peopleArray.map((people) => (
      `${people.name ? people.name : ''} ${people.last_name ? people.last_name : ''}`
  })
  .join('\n') : ''

  return peopleString
}

I've posted a working version here供您查看
希望这有帮助!

你不想返回一个字符串，你想返回一个元素数组：

let peopleString = peopleArray.map((people) => (
  <div>
   {people.name || ""},
   {people.last_name || ""}
  </div>
));
return peopleString

export const showPeople = (peopleArray = []) => {
  let peopleString = peopleArray ? peopleArray.map(people => 
  `<div>
      ${people.name}, ${people.last_name}
    </div>`
  ).join('') : ''
  return peopleString
}

x一个一个一个一个x一个一个二个x

因为你没有使用变量进行字符串连接。你需要移除div中的模板字符串。

在我看来，您没有在map函数中返回任何东西：
第一个月
我的建议很简单：
(people) => ( ...string here... )
或：
(people) => { return ...string here... }
另一个问题可能是，您似乎打算在map函数中返回的不是字符串，而（？）可能应该是字符串;如果不了解它的功能就很难说。

所以如果你特别想使用HTML的换行符元素来分隔字符串，你可以使用这个。

import { Fragment, ReactNode } from "react";

const separateWithLineBreaks = (strings: string[]): ReactNode => {
  return (
    <Fragment>
      {strings.map((str, index) => (
        <Fragment key={index}>
          {str}
          {index < strings.length - 1 && <br />}
        </Fragment>
      ))}
    </Fragment>
  );
};