javascript - 遍历for循环并将结果附加到react组件

我对如何遍历数组并将结果附加到react组件感到好奇。
我已经完成了对一组对象进行排序并获取我想要的帐户的工作。现在我不确定如何将它们附加到html。

export default class SortedTeams extends React.Component {


  renderContent(content){
    var entries = [{fullname: 'foo', title: 'designer'}, {fullname:
    'foo2',
    title: 'designer'}, {fullname: 'foo3', title: 'developer'}]
    var nohit = [];

    for(var i = 0; i <= entries.length - 1; i++) {

      if(entries[i].title === 'designer'){
        console.log('foohit');
  }
      else{
        nohit.push('nope')
   }
  }

  render() {
    var content = this.props.block.content;


    return(
      <SiteBuilderBlock tag="section" className="sortedTeams" block={this.props.block}>
        <div>
        <SiteBuilderList tag="div" list="teams" inGroupsOf={4} inGroupsOfClassName="row">
         {(element, key) => this.renderContent(element, key)}
      </SiteBuilderList>
    </div>

  </SiteBuilderBlock>
);

}

}

最佳答案

使用.map()遍历数组。在这种情况下，contacts是对象的数组，例如entries。在这里，我使用ES6语法和JSX。


  map（）方法创建一个新数组，并在调用数组中的每个元素上调用提供的函数。

return(
  <div>
    <ul>
      { contacts.map(contact => (
          <li key={contact.id}>
            {contact}
          </li>
        )
      )}
    </ul>
  </div>
);

关于javascript - 遍历for循环并将结果附加到react组件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45822418/