我试图在React JSX（其中ObjectRow是一个单独的组件）中执行以下操作：
<tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody>
我意识到并理解为什么这不是有效的JSX，因为JSX映射到函数调用。然而，由于来自模板领域，而且是JSX的新手，我不确定如何实现上述目标（多次添加组件）。
当前回答
在渲染或任何函数中，在返回之前，可以使用变量来存储JSX元素。就像这样-
const tbodyContent = [];
for (let i=0; i < numrows; i++) {
tbodyContent.push(<ObjectRow/>);
}
在身体内部使用它，如下所示：
<tbody>
{
tbodyContent
}
</tbody>
但我更喜欢map（）而不是这个。
其他回答
JSX内部的循环非常简单。试试看：
return this.state.data.map((item, index) => (
<ComponentName key={index} data={item} />
));
要循环多次并返回，可以通过from和map实现：
<tbody>
{
Array.from(Array(i)).map(() => <ObjectRow />)
}
</tbody>
其中i=次数
如果您想为渲染组件分配唯一的键ID，可以使用React文档中建议的React.Children.toArray
对阵列进行反应
将子级不透明数据结构作为平面数组返回，并为每个子级分配键。如果要在渲染方法中处理子对象的集合，特别是如果要在传递之前对this.props.children进行重新排序或切片，则非常有用。
注：React.Children.toArray（）在展平子列表时更改键以保留嵌套数组的语义。也就是说，toArray在返回的数组中给每个键加前缀，以便每个元素的键都被限定到包含它的输入数组中。
<tbody>
{
React.Children.toArray(
Array.from(Array(i)).map(() => <ObjectRow />)
)
}
</tbody>
当我想添加一定数量的组件时，我使用助手函数。
定义一个返回JSX的函数：
const myExample = () => {
let myArray = []
for(let i = 0; i<5;i++) {
myArray.push(<MyComponent/>)
}
return myArray
}
//... in JSX
<tbody>
{myExample()}
</tbody>
使用Array映射函数是一种非常常见的循环遍历元素数组并在React中根据元素创建组件的方法。这是一种很好的循环方式，非常有效，也是在JSX中进行循环的一种整洁的方式。这不是唯一的方法，而是首选的方法。
此外，不要忘记根据需要为每个迭代提供唯一的Key。map函数从0创建一个唯一索引，但不建议使用生成的索引，但如果您的值是唯一的或存在唯一的键，则可以使用它们：
<tbody>
{numrows.map(x=> <ObjectRow key={x.id} />)}
</tbody>
此外，如果您不熟悉Array上的map函数，MDN中的几行代码：
map为数组，并根据结果构造一个新数组。回调仅对具有赋值的数组的索引调用，包括未定义的。对于缺少数组（即从未设置过的索引删除或从未被赋值）。回调是用三个参数调用的：元素的值，元素的索引和正在遍历的Array对象。如果向映射提供了thisArg参数，它将用作callback就是这个值。否则，未定义的值将用作这就是它的价值。回调最终可观察到的值为根据通常的规则确定通过函数。map不会改变调用它的数组（尽管回调（如果调用）可能会这样做）。
你当然可以按照另一个答案的建议用.map来解决。如果您已经使用了Babel，可以考虑使用jsx控制语句。
它们需要一些设置，但我认为在可读性方面是值得的（特别是对于非React开发人员）。如果使用linter，还有eslint-plugin-jsx控制语句。
