類型錯誤：無法讀取 ReactDataGrid 中未定義的屬性“長度”

Question

我運行的代碼是：

import React from "react"; 
import ReactDataGrid from "react-data-grid";
const styles = {
    fontFamily: "sans-serif",
    textAlign: "center"};

const Example = () => { 
  const columns = [
    { key: "id", name: "ID" },
    { key: "title", name: "Title" },
    { key: "count", name: "Count" }
  ];
  const data = [
    { id: 0, title: "row1", count: 20 },
    { id: 1, title: "row1", count: 40 },
    { id: 2, title: "row1", count: 60 }
  ];
  return (
    <div style={styles}>
      <div>
        <ReactDataGrid
          columns={columns}
          rowGetter={i => data[i]}
          rowsCount={3}
          minHeight={150}
        />
      </div>
    </div>
  );
};
export default Example;

這是錯誤信息

甚至他們官方web中同樣的例子提示同樣的錯誤。 那么有什么建議嗎？

為項目自動安裝的依賴項：

"@emotion/react": "11.0.0",
"@emotion/styled": "11.0.0",
"@inovua/reactdatagrid-enterprise": "^4.0.8",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"jquery": "^3.5.1",
"react": "^17.0.1",
"react-data-grid": "^7.0.0-canary.33",
"react-dom": "^17.0.1",
"react-hover": "^2.0.0",
"react-icons": "^3.11.0",
"react-lightbox-component": "^1.2.1",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.0",
"react-scroll": "^1.8.1",
"react-select": "^3.1.0",
"stream-chat": "^2.7.4",
"stream-chat-react": "^3.2.2",
"styled-components": "^5.2.1",
"twin.macro": "^1.0.0-alpha.7",
"typescript": "^4.0.5",
"web-vitals": "^0.2.4"

任何建議將不勝感激。 謝謝！

Answer 1

嘗試

return (
        <ReactDataGrid rows={rows}
                       columns={columns}/>
    );

文檔中甚至沒有提到 rows prop，這似乎已經過時了

來源： https://github.com/adazzle/react-data-grid/issues/2030