React-Data-Grid 只显示 9 行

Question

我正在加载一个带有数据源的 react-data-grid，该数据源是逐行填充的（每秒添加一行）。一旦达到 9 行，它就会停止添加行。我还有另一个问题，在我更改屏幕上的缩放比例之前，网格不会显示。事先是空白的。这是我的网格元素

import React, { Component } from 'react';
import DataGrid from 'react-data-grid';
import 'react-data-grid/dist/react-data-grid.css';

const columns = [
  { key: 'timeStamp', name: 'Date/Time' },
  { key: 'gpsAccuracyValue', name: 'GPS Accuracy' },
  { key: 'speedMph', name: 'Speed' },
  { key: 'battery', name: 'Battery' },
  { key: 'id', name: 'id' },
];

const rows = [
  { id: 0, title: 'Example' },
  { id: 1, title: 'Demo' }
];

class TestGrid extends Component {


render(){
    return (
        <div>
        <DataGrid
          columns={columns}
          rows={this.props.data}
          rowsCount={this.props.data.length}
          minHeight={500}
        />
        </div>
      );
    }
}

export default TestGrid;

我这样传入数据

<TestGrid data={this.props.deviceData} />

Answer 1

CodeSandbox

添加style={{ height:500 }} 似乎解决了我遇到的类似问题并显示超过 9 行。