遍历数组元素时出错

Question

我有以下数组 -

var arr= [ 
{
 id:1,
 name:"some name 1",
 email:"somename1@email.com"
},
{
 id:2,
 name:"some name 2",
 email:"somename2@email.com"
}
]

我想以一种方式迭代，我希望 output 作为字符串（半列分隔的名称字符串）-

"some name 1;some name 2"

我以下面的方式迭代它 -

var name="";
arr.forEach( (item:any)=> {
name+=item.name+";";
});

但是我遇到了以下错误-

UncoughtError : Objects are not valid as react child (found object with keys {id , name , email}). If you want to render collection of child use array instead.

编辑：

return (
<span> {name} </span>
)

Answer 1

实现所需内容的一种简单方法是使用Array.prototype.reduce()

您可以使用 ES6 尝试以下代码：

 const arr= [ { id:1, name:"some name 1", email:"somename1@email.com" }, { id:2, name:"some name 2", email:"somename2@email.com" } ] const newString = arr.reduce((preVal, newVal) => `${preVal} ${preVal? ";": ""} ${newVal.name} `, "") console.log(newString)

Answer 2

该错误通常意味着您正在尝试渲染不直接是 React 组件的东西