React FixedDataTableセルは常にすべてが未定義です

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)から、私はそれがちょうどオブジェクトを参照してください。オブジェクトの配列を必ず送信してください。あなたのテーブルにデータをロードすればいいperiodData.length

でなければなりませんTableに渡す

セカンドrowsCount。

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

// ...