在 ReactJS 中的數組 object 之后添加空格

Question

我在 React 中映射一個數組，在其中輸出保存在數組中的標簽。 我在每個 object 之后都有逗號，但也想要一個空格。

這是映射代碼：

{
    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中逗號后面已經有空格了

Answer 1

它顯示時沒有空格，因為這是數組的默認字符串表示形式。 您可以使用連接function 使用您想要的任何分隔符連接每個元素。

就您而言，我認為逗號后跟空格是您想要的。

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