javascript - 在 array.map 中渲染元素时删除尾随逗号

Question

是否有任何简单的方法可以删除以下代码段中的尾随逗号

const renderElements = () => {
    if (!(data && data.length)) return [];
    return data.map(({ id, name }, index) => (
      <p key={id}>{`${name}${
        !(index === data.length - 1) ? "," : ""
      }`}</p>
    ));
}


return (
 <div>
  {renderElements()}
</div>
)

标签： javascriptreactjs

Answer 1

您的代码运行良好，那么为什么还要寻找另一种编写方式呢？

但也许，您不需要手动插入逗号，只需将其留给 css：

const renderElements = () => {
    if (!(data && data.length)) return [];
    return data.map(({ id, name }) => (
      <p key={id}>{name}</p>
    ));
}


return (
  <div>
    {renderElements()}
  </div>
);

div p {
  display: inline;
}

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

<div>
  <p>Alice</p>
  <p>Bob</p>
  <p>Charlie</p>
  <p>David</p>
</div>