在 ReactJS 中的数组对象后添加空格答案

【问题标题】：Add space after array object in ReactJS在 ReactJS 中的数组对象后添加空格
【发布时间】：2020-04-28 15:48:37
【问题描述】：

我在 React 中映射一个数组，我正在输出数组中保存的标签。我在每个对象后面都有逗号，但也想要一个空格。

这是映射代码：

{
    result &&
        result.map(project => {
            if (project.item) project = project.item;
            return (
                <ProjectStyling key={project.id}>
                    <h4>Project Tags:</h4>
                    <p>{(project ? " " : ", ") + project.keywords}</p>
                </ProjectStyling>
            );
        });
}

目前它看起来像“Bob,Foo,Bar”，我希望它看起来像“Bob, Foo, Bar”

注意jsx中逗号后面已经有空格了

【问题讨论】：

我不明白——你是说project.keywords 是一个数组，你想控制它们的显示方式？
是的，我希望每个数组元素后都有空格
然后对它们做点什么，不要只依赖JS数组的默认字符串表示。

标签： javascript arrays reactjs

【解决方案1】：

它显示时没有空格，因为这是数组的默认字符串表示形式。您可以使用 join 函数将每个元素与您想要的任何分隔符连接起来。

在您的情况下，我认为逗号后跟空格是您想要的。

<h4>Project Tags:</h4>
<p>{project.keywords.join(', ')}</p>

【讨论】：