react.js 循环输出问题

方法一：将要输出的列表直接保存在数组中

var Demo = React.createClass({
    getInitialState:function(){
        return {lenght:3}
    },
    render:function(){
        var items = [];
        for (var i = 0; i < 3; i++) {
            items.push(<div className="item">gagaag</div>);
        }

        return (
            <div>
                {items}
            </div>
        )
    }
})
React.render(<Demo/>,document.getElementById('example'))

方法二：在渲染的时候，才循环输出每个列表

import React from "react";
import { ListItem, List, Button } from "@material-ui/core";
//xml转json

interface Props{
    listArray:Array<string>,//列表数组
}
class Jiekou extends React.Component<Props>{
   
    render() {
        return (
            //遍历输出
            <List>
               {this.props.listArray.map(x => (<ListItem>{x}</ListItem>))}            
            </List>
        )
    }

}
export default Jiekou;