我在反应中有一个传递的组件,因此道具中的数据是
<Mycomponent names={[{name: 'peter'},{name: 'pan'}]} />
然后我有一个具有表的组件,我想在其中显示数据
这里是组件
import React from 'react';
const Mycomponent = (props) => <div>
<table>
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>{ props.names }</td>
</tr>
</tbody>
</table>
</div>;
export default Mycomponent;
如何在<tr><td>{props.names.name}</td></tr>
中循环显示每个名称?
答案 0 :(得分:3)
<tbody>
{
props.names.map( ({name}, i) => <tr key={i}><td>{ name }</td></tr> )
}
</tbody>
将遍历所有props.names并为每个props.name返回一个tr