我试图在React JSX（其中ObjectRow是一个单独的组件）中执行以下操作：
<tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody>
我意识到并理解为什么这不是有效的JSX，因为JSX映射到函数调用。然而，由于来自模板领域，而且是JSX的新手，我不确定如何实现上述目标（多次添加组件）。
当前回答
甚至这段代码也能完成同样的工作。
<tbody>
{array.map(i =>
<ObjectRow key={i.id} name={i.name} />
)}
</tbody>
其他回答
如果没有键值par，则使用以下代码打印数组值-
<div>
{my_arr.map(item => <div>{item} </div> )}
</div>
简单的方法
您可以将numrows置于状态，并使用map（）代替for循环：
{this.state.numrows.map((numrows , index) => {
return (
<ObjectRow
key={index}
/>
您只能在JSX元素中编写JavaScript表达式，因此for循环无法工作。您可以先将元素转换为数组，然后使用map函数渲染它：
<tbody>
{[...new Array(numrows)].map((e) => (
<ObjectRow/>
))}
</tbody>
有趣的是，人们如何使用更新的语法或不常见的方法来创建数组，从而给出“创造性”的答案。在我使用JSX的经验中，我见过这些技巧，只有经验不足的React程序员才会使用。
解决方案越简单，对未来的维护人员就越好。由于React是一个web框架，通常这种类型的（表）数据来自API。因此，最简单和最实用的方法是：
const tableRows = [
{id: 1, title: 'row1'},
{id: 2, title: 'row2'},
{id: 3, title: 'row3'}
]; // Data from the API (domain-driven names would be better of course)
...
return (
tableRows.map(row => <ObjectRow key={row.id} {...row} />)
);
您可以在React for循环中使用.map（）。
<tbody>
{ newArray.map(() => <ObjectRow />) }
</tbody>
