我正在尝试映射一个数组并在每个实例之间添加逗号，最后一个实例除外

Question

我想列出从后端返回的所有用户的名称。我选择不将它们放在<ul>或<ol>中，因为我希望它们以逗号分隔，以内联方式显示。我想知道最好的方法是在每个名字后面加逗号，除了最后一个，现在我正在映射这样的值：

<p>
You have notes for the following users that are overdue:
{list && list.map((items) => <> {items.userName},</>)}
</p>

Answer 1

您可以使用Array#join:

<p>
You have notes for the following users that are overdue:
{ list && list.map((items) => items.userName).join(',') }
</p>

---

如果您希望这些名称在单独的标签中，您也可以通过使用css：来实现这一点

<p>
You have notes for the following users that are overdue:
{list && list.map((items) => <span class="name">{items.userName}</span>)}
</p>

p .name:not(:last-of-type)::after {
content: ',';
}