反應FixedDataTable單元總是得到一切都是undefined

Question

我在嘗試使用React FixedDataTable，我總是得到一切都是未定義的。 我還是這個圖書館的新手，誰能幫我弄清楚什麼是錯的。

這裏是我的形式：

import React from 'react'; 
const {Table, Column, Cell} = require('fixed-data-table'); 

class MyCell extends React.Component { 
    render() { 
    var {rowIndex, data, field, ...props} = this.props; 
    return (
     <Cell {...props}> 
     {data[rowIndex][field]} 
     </Cell> 
    ); 
    } 
} 

export default class PeriodTable extends React.Component { 

    constructor(props) { 
    super(props); 
    } 

    render() { 
    const {periodTableHeader, periodTableField, periodData} = this.props; 

    console.log(periodData); 
    console.log(periodTableHeader); 
    console.log(periodTableField); 

    return (

     <div> 
      <Table 
      rowsCount={100} 
      rowHeight={50} 
      headerHeight={50} 
      width={1000} 
      height={500}> 
      {periodTableHeader.map((data, index) => { 
       let header = periodTableHeader[index] 
       let field = periodTableField[index]; 
       return(
       <Column 
        header={<Cell>{header}</Cell>} 
        cell={<MyCell data={periodData} field={field} />} 
        width={200} 
       /> 
      ) 
      })} 
      </Table> 
     </div> 
    ) 
} 
} 

的console.log（periodData）：

的console.log（periodTableHeader）：

的console.log（periodTableField）：

是我的語法是錯誤的可能？

Answer 1

首先你的periodData應該是一個對象數組。從你的console.log(periodData)我看到它只是一個對象。確保你發送了一個對象數組。

二rowsCount你傳遞給Table應該periodData.length

這應該做你的表加載數據。

<Table 
     rowsCount={periodData.length} 
     rowHeight={50} 
     headerHeight={50} 
     width={1000} 
     height={500}> 

// ...