我试图在React JSX（其中ObjectRow是一个单独的组件）中执行以下操作：
<tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody>
我意识到并理解为什么这不是有效的JSX，因为JSX映射到函数调用。然而，由于来自模板领域，而且是JSX的新手，我不确定如何实现上述目标（多次添加组件）。
当前回答
JSX内部有多种循环方式
使用for循环函数TableBodyForLoop（props）{常量行=[]；//创建数组以存储tr列表for（设i=0；i<props.people.length；i++）{const person=道具.人物[i]；//将tr推到数组，关键是行.推(<tr key={person.id}><td>｛person.id｝</td><td>｛人名｝</td></tr>);}//返回tbody内的行return<tbody>｛rows｝</tbody>；}使用ES6阵列映射方法函数TableBody（props）{返回(<tbody>{props.people.map（person=>(<tr key={person.id}><td>｛person.id｝</td><td>｛人名｝</td></tr>))}</tbody>);}
完整示例：https://codesandbox.io/s/cocky-meitner-yztif
以下React文档将有所帮助
列表和键条件渲染
其他回答
试试这个
<tbody>
{new Array(numrows).map((row,index)=><ObjectRow key={***someThingUniqe***}/>)} //don't use index as key
</tbody>
如果您想知道为什么不应该在react中使用索引作为键，请检查此项
您可能需要签出React Templates，它允许您在React中使用JSX样式的模板，并带有一些指令（例如rt repeat）。
如果使用反应模板，您的示例如下：
<tbody>
<ObjectRow rt-repeat="obj in objects"/>
</tbody>
return (
<table>
<tbody>
{
numrows.map((item, index) => {
<ObjectRow data={item} key={index}>
})
}
</tbody>
</table>
);
我不确定这是否适用于您的情况，但通常地图是一个很好的答案。
如果这是使用for循环的代码：
<tbody>
for (var i=0; i < objects.length; i++) {
<ObjectRow obj={objects[i]} key={i}>
}
</tbody>
你可以用地图这样写：
<tbody>
{objects.map(function(object, i){
return <ObjectRow obj={object} key={i} />;
})}
</tbody>
ES6语法：
<tbody>
{objects.map((object, i) => <ObjectRow obj={object} key={i} />)}
</tbody>
React元素是简单的JavaScript，因此您可以遵循JavaScript的规则。您可以在JavaScript中使用for循环，如下所示：-
<tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody>
但有效且最好的方法是使用.map函数。如下所示：-
<tbody>
{listObject.map(function(listObject, i){
return <ObjectRow key={i} />;
})}
</tbody>
在这里，有一件事是必要的：定义密钥。否则，它将发出如下警告：-
Warning.js:36警告：数组或迭代器中的每个子级都应该具有独特的“钥匙”道具。检查ComponentName的渲染方法。看见“链接”了解更多信息。
