文章目录

点击这里访问站长的博客

React: JSX里面循环生成多个子元素

用这个方法可以循环生成多个子元素

function Welcome(props) {
    props.name = 'test';
  return <h1>Hello, {props.name}</h1>;
}

function WelcomeList(nameList) {
    var nameDOM = [];
    for (var i = 0; i < nameList.length; i++) {
        nameDOM.push(Welcome({name: nameList[i]}))
    }
    return nameDOM;
}

function Root() {
    var nameList = ["Mike","Jack","Dick"];
  return (
    <div>
        {WelcomeList(nameList)}
    </div>
  );
}

ReactDOM.render(
  <Root />,
  document.getElementById('root')
);