内循环反应JSX

Question

内循环反应JSX我试着做一些类似于以下反应的事情JSX(ObjectRow是一个单独的组件)：<tbody>     for (var i=0; i < numrows; i++) {         <ObjectRow/>     } </tbody>我知道并理解为什么这是无效的JSX，因为JSX映射到函数调用。然而，从模板土地和是新的JSX，我不确定如何实现上述目标(多次添加组件)。

Answer 1

不确定这是否适用于你的情况，但通常地图是个很好的答案。

如果这是使用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>