How to adjust the height of DataTable PrimeReact

Question

I cannot stretch the table to the full height of the block even with one record

I'm using PrimeReact in my app and this is my code:

<DataTable
                value={dataArr}
                headerColumnGroup={headerGroup}
                paginator
                rows={1}
                rowsPerPageOptions={[10, 25, 50]}
                rowHover
                responsiveLayout="scroll"
                showGridlines
                stripedRows
                resizableColumns
                
            >
....
            </DataTable>

Answer 1

Because you are using responsiveLayout="scroll", you want to set scrollHeight="200px" or whatever height you want.

Example:https://codesandbox.io /s/boring-star-jvzoei?file=/src/demo/DataTablePaginatorDemo.js