当滚动条应用时，如何从 mui 网格数据表中删除多余的空间？

问：

我正在使用 mui 数据网格，当 ScrollBar 出现时，我面临的问题表格标题也占用了一些空间，我希望该行只占用空间。

下面是我的代码，在这里我给 DataGrid 提供了一些内联样式。

<DataGrid
  disableRowSelectionOnClick
   style={{
     maxHeight: `calc(100vh - ${HEADER_HEIGHT + 24 + 92 + 40}px)`,
     overflowY: "auto",
     scrollBehavior: "smooth",
   }}

  sx={{
    "& .super-app-theme--header": {
      background: "#F1F5F9",
      paddingLeft: "24px",
      fontSize: "12px",
      fontWeight: "500",
      letterSpacing: "0.05em",
      color: "#6b778c",
    },
    "&.MuiDataGrid-root": {
      borderRadius: "0px",
      borderBottomLeftRadius: "6px",
      borderBottomRightRadius: "6px",
    },
    "& .MuiDataGrid-cell:focus": {
      outline: "none",
    },
    "& .MuiDataGrid-cell": {
      paddingLeft: "24px",
    },
  }}
  rows={fetchIndustryQuery.data.map((industryData) => ({
    id: industryData.industry.id,
    name: industryData.industry.name,
    createdBy: industryData.creatorName,
    createdById: industryData.industry.createdBy,
  }))}
  columns={industryColumns}
  loading={fetchIndustryQuery.isLoading}
  initialState={{
    pagination: {
      paginationModel: {
        pageSize: 10,
      },
    },
  }}
  pageSizeOptions={[10]}
/>