2016-03-28 65 views
2

我想通過使用Facebook的固定數據表實現一個動態填充的數據列。我收到列數在10 - 100之間的數據。所以我的意圖是動態創建列。下面是我曾嘗試如何在固定數據表中添加動態列

Class App extensd React.Component{ 
 
    render(){ 
 
    return (
 
      <Table 
 
       rowHeight={50} 
 
       headerHeight={30} 
 
       groupHeaderHeight={30} 
 
       rowsCount={10} 
 
       width={tableWidth} 
 
       height={500} 
 
       {...this.props}> 
 
       
 
      {["firstName","lastName","bs","email"].forEach(function(columnName){ 
 
      return <Column 
 
        columnKey={columnName} 
 
        header={ <Cell>Header</Cell>} 
 
        cell={<Cell>Cell Content</Cell>} 
 
        width={200} 
 
    /> 
 
) 
 
    } 
 
})}

它不工作。有沒有人曾經嘗試過類似的東西?任何幫助將不勝感激。先謝謝你。

+0

你有拼寫錯誤** **延伸。此外,如果內部有子組件,則打開的標籤需要使用結束標籤來關閉。 –

+3

除了拼寫錯誤外,'forEach'方法不返回新數組;你需要使用'map'來代替。 –

+0

謝謝@JeffWooden。這真是愚蠢的我。 – dhiraj

回答

3

什麼工作是,用地圖代替每個。謝謝@ jeff-Wooden。

Class App extends React.Component{ 
 
    render(){ 
 
    return (
 
      <Table 
 
       rowHeight={50} 
 
       headerHeight={30} 
 
       groupHeaderHeight={30} 
 
       rowsCount={10} 
 
       width={tableWidth} 
 
       height={500} 
 
       {...this.props}> 
 
       
 
      {["firstName","lastName","bs","email"].map(function(columnName){ 
 
      return <Column 
 
        columnKey={columnName} 
 
        header={ <Cell>Header</Cell>} 
 
        cell={<Cell>Cell Content</Cell>} 
 
        width={200} 
 
    /> 
 
) 
 
    } 
 
})}