admin管理员组

文章数量:1385002

By using <DataGrid autoPageSize/>, as described in the docs, you can get a Material UI table that automatically sets the page size (ie the number of rows per page) based on the browser height. However, if you are progressively loading data from the server, you need to know what that page size is, in order to know how much data to load per page, and which row the table is up to. As far as I can tell, the DataGrid only gives you access to the page number (through various events) which doesn't let you determine the page size.

The ponent does give you access to a pageSizeChange event, but this doesn't actually fire when the ponent automatically sets its page size using autoPageSize, so it doesn't help here.

By using <DataGrid autoPageSize/>, as described in the docs, you can get a Material UI table that automatically sets the page size (ie the number of rows per page) based on the browser height. However, if you are progressively loading data from the server, you need to know what that page size is, in order to know how much data to load per page, and which row the table is up to. As far as I can tell, the DataGrid only gives you access to the page number (through various events) which doesn't let you determine the page size.

The ponent does give you access to a pageSizeChange event, but this doesn't actually fire when the ponent automatically sets its page size using autoPageSize, so it doesn't help here.

• javascript
• reactjs
• datagrid
• material-ui

Share Improve this question Follow asked Aug 12, 2021 at 7:02 MigwellMigwell 20.2k2424 gold badges106106 silver badges180180 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

I also ran into the same issue of trying to use DataGrid with server-side pagination. After some digging around, I found that I'm able to see that onPageSizeChange is triggered when the ponent first loads. See this codesandbox.

If you look at the console after refreshing the codesandbox browser, it prints 0, then 5. You could save this into state and then use it in your onPageChange calls.

2023 update - MUI X 6.18.4

UPDATE: the accepted answer is a bit older and the onPageSizeChange is indeed not available anymore I found out that you can get the calculated page size through the onPaginationModelChange.

you also get this information through the onStateChange but you will have to dig a bit to find it. (It's located in pagination.paginationModel.pageSize).

本文标签： javascriptAccess the page size in a Material UI ltDataGrid autoPageSizegtStack Overflow