jsx中的concat对象与逗号反应

Question

我有一个像这样的用户对象

user: {
name: "james",
contact: "3245234545",
email: "james@gmail.com"
}

我希望像这样显示它

james, 3245234545, james@gmail.com

如果它是一个数组我可以加入（'，'）但不幸的是它是一个对象。我目前的做法是这样的

{this.user &&
<div>
{this.user.name} ,{this.user.contact}, {this.user.email}
</div>
}

如果用户没有填写他们的联系方式，这会有效但不完美然后额外的,仍在那里。如果电子邮件是可选的，那么最后还会有额外的,。

Answer 1

您可以使用Object.keys：

{this.user &&
<div>
{Object.keys(this.user).map(key => this.user[key]).join(', ')}
</div>
}

还有Object.entries，但它得不到很好的支持，所以你必须使用polyfill。

另请注意，对象键的顺序可能不是您定义的顺序，但大多数浏览器会保留顺序，您可能需要使用Map代替。