JSX中使用For循环

你可以在JSX中使用for循环吗？
或者更确切地说，写这样一个for的方法是什么？JSX中使用For循环

var graph = 
     <div className={"chartContent"}> 

     . 
     . 
     . 

      <div className="panel"> 
       {DataRows.forEach(function(entry) && 
        <div className="col-sm-2 graphPanel graphPanelExtra"> 
         <div className="panel panel-primary"> 
          <div>entry</div> 
         </div> 
        </div> 
       )} 

      </div> 
     </div>;

来源

2017-09-14 morne

使用一个map所以你实际上返回的元素。一个foreach不会返回任何东西。您使用&&也是无效的。

var graph = 
     <div className={"chartContent"}> 
      <div className="panel"> 
       {DataRows.map(entry => 
        <div key={entry.id} className="col-sm-2 graphPanel graphPanelExtra"> 
         <div className="panel panel-primary"> 
          <div style={{textAlign: 'center'}}>entry</div> 
         </div> 
        </div> 
       )} 
      </div> 
     </div>;

注意，我添加了key属性 - 用于反应以优化每个项目应该有一个唯一的密钥元件的阵列的呈现（即不只是数字指数）。

来源

2017-09-14 10:55:09

你好多米尼克。如果它的“（entry）”是一个Key Value对。你如何分离价值观？请。 – morne

条目是一个对象？在这种情况下，你可以做'Object.keys（entry）.map（...' –

是的，抱歉，刚才看到了。谢谢 – morne

forEach不返回任何东西。你不会看到任何结果。相反，您可以使用.map

{ 
    DataRows.map(function (entry) { 
      return <div className="col-sm-2 graphPanel graphPanelExtra"> 
         <div className="panel panel-primary"> 
          <div style={{textAlign: 'center'}}>entry</div> 
         </div> < /div> 
       }) 
}

来源

2017-09-14 10:55:30

比使用forEach循环而你可以使用Array.prototype.map()

var graph = 
    <div className={"chartContent"}> 

    . 
    . 
    . 

     <div className="panel"> 
      {DataRows.map((entry) => (
       <div className="col-sm-2 graphPanel graphPanelExtra"> 
        <div className="panel panel-primary"> 
         <div style={{textAlign: 'center'}}>entry</div> 
        </div> 
       </div> 
       ) 
      )} 

     </div> 
    </div>;

来源

2017-09-14 10:55:57 bennygenel

JSX中使用For循环

回答

相关问题