我试图在React JSX（其中ObjectRow是一个单独的组件）中执行以下操作：
<tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody>
我意识到并理解为什么这不是有效的JSX，因为JSX映射到函数调用。然而，由于来自模板领域，而且是JSX的新手，我不确定如何实现上述目标（多次添加组件）。
当前回答
问题是您没有返回任何JSX元素。对于这种情况还有另一种解决方案，但我将提供最简单的解决方案：“使用map函数”！
<tbody>
{ numrows.map(item => <ObjectRow key={item.uniqueField} />) }
</tbody>
它是如此简单和美丽，不是吗？
其他回答
如果您已经在使用lodash，_.times函数很方便。
import React, { Component } from "react";
import Select from "./Select";
import _ from "lodash";
export default class App extends Component {
render() {
return (
<div className="container">
<ol>
{_.times(3, (i) => (
<li key={i}>repeated 3 times</li>
))}
</ol>
</div>
);
}
}
问题是您没有返回任何JSX元素。对于这种情况还有另一种解决方案，但我将提供最简单的解决方案：“使用map函数”！
<tbody>
{ numrows.map(item => <ObjectRow key={item.uniqueField} />) }
</tbody>
它是如此简单和美丽，不是吗？
你必须用JSX写：
<tbody>
{
objects.map((object, i) => (
<ObjectRow obj={object} key={i} />
));
}
</tbody>
ECMAScript 2015/Babel可能使用生成器函数创建JSX数组：
function* jsxLoop(times, callback)
{
for(var i = 0; i < times; ++i)
yield callback(i);
}
...
<tbody>
{[...jsxLoop(numrows, i =>
<ObjectRow key={i}/>
)]}
</tbody>
只需使用.map（）循环遍历集合，并从每个迭代返回带有道具的＜ObjectRow＞项。
假设对象是某处的数组。。。
<tbody>
{ objects.map((obj, index) => <ObjectRow obj={ obj } key={ index }/> ) }
</tbody>
