For循環反應渲染方法

我想爲我的grid.I創建分頁鏈接。我將maxPages（數字）屬性傳遞給組件，但我不能用於渲染方法。我能做什麼？For循環反應渲染方法

var Pagination = React.createClass({ 

render: function(){ 


    return(
    <div class="text-center"> 
     <ul class="pagination"> 

      <li><a href="#">«</a></li> 
      {for (var i=0;i <10;i++;) 
      { 
       return(<li><a href="#">i + 1 </a></li>); 
      } 
      } 

      <li><a href="#">»</a></li> 
     </ul> 
    </div>); 

}});

來源

2015-04-24 user1924375

您可以運行呈現前環（注意，在你的for循環是一個錯誤）

var lis = []; 

for (var i=0; i<10; i++) { 
    lis.push(<li><a href="#">{i + 1}</a></li>); 
} 

var Pagination = React.createClass({ 
    render: function(){ 
     return(
      <div class="text-center"> 
       <ul class="pagination"> 

        <li><a href="#">«</a></li> 
        {lis} 
        <li><a href="#">»</a></li> 
       </ul> 
      </div> 
     ); 
    } 
});

FIDDLE

來源

2015-04-25 00:07:12 adeneo

請注意，將組件放置在渲染之外，然後在渲染中使用它們會在0.13中破壞一些東西（0.14正在改變這一點）。 – FakeRainBrigand

你只能嵌入表達式插入JSX。

<ul className="pagination">{children}</ul>

轉換爲類似

React.createElement('ul', {className: 'pagination'}, children);

你現在看你怎麼可能永遠不會有替代的children一個for循環？語句不能在函數調用表達式中。

您可以事先創建一個數組，例如adeneo showed in their answer。

來源

2015-04-25 00:08:43

奇怪的是，運行'map'是因爲它返回一個數組 - > https://jsfiddle.net/adeneo/69z2wepo/7038/ – adeneo

是的，因爲'Array（10）.join（）。split（'，' ）.map（...）'是表達式:)'React.createElement（'ul'，{className：'pagination'}，Array（10）.join（）。split（'，'）。map（。 ..））;'不是語法錯誤。 –

Aha，所以'createElement'接受一個孩子，一組兒童或文本內容，並且返回其中一個的任何表達式都是有效的。 – adeneo

For循環反應渲染方法

回答

相關問題