material-ui 데이터 Grid 무한 연장 시 대응

시험해 보았는데Material UI의 Data Grid 다음과 같이 구성 요소가 설정되어 무한한 연장 현상을 겪었다.
<div>
  <div>some title</div>
  <DataGrid
    pageSize={5}
    columns={columns}
    rows={rows} />
</div>

해결책


설마 데이터가 다시 업데이트되었단 말인가?잠깐만, useMemo를 사용해 봐도 안 돼.
그곳에서 엑시플과 눈을 부릅뜨고 보니 부모님을 둘러친 것 같다<div style={{ height: 400, width: "100%" }}>.
<div style={{ height: 400, width: "100%" }}>
  <DataGrid
    pageSize={5}
    columns={columns}
    rows={rows} />
</div>
확실히 이렇게 Infinity loop이 끝납니다.그러나 반드시 하나하나 Height를 지정해야 하는데, 이게 무슨 방법이 있습니까?APIauthHeight 두 항목을 살펴보았습니다.
<DataGrid
  autoHeight
  pageSize={5}
  columns={columns}
  rows={rows} />
그래도 무한연장은 끝났다.
하지만 Auto Height 프로젝트를 보면 숨겨진 영역을 숨기는 Virtualization을 하지 않기 때문에 대규모 데이터는 적합하지 않다.

좋은 웹페이지 즐겨찾기