primefaces / primevue

Next Generation Vue UI Component Library
https://primevue.org
MIT License
10.56k stars 1.23k forks source link

DataTable Paginator: The first load of the DataTable does not use the default "rows" parameter #6274

Closed yhercouet closed 2 months ago

yhercouet commented 2 months ago

Describe the bug

When I added the pagination on several of my DataTables in my app, all of them displayed an empty array at first.

I quickly realized that this problem was due to the fact that the list allowing to select the pagination number was empty at first (cf. screenshot). Once I select a value in this list, the data appears normally and everything is fine.

Am I missing something?

The only 3 lines of code I added are :

paginator :rows="20" :rowsPerPageOptions="[10, 20, 30, 50]"

Here is the complete DataTable declaration:

`<DataTable class="kd-datagrid" size="small" :value="alertsList" stateStorage="local" stateKey="alertsFilters2" removableSort sortField="modified" :sortOrder="-1" scrollable scrollHeight="1200px" stripedRows editMode="cell" @cell-edit-complete="onCellEditComplete" v-model:filters="activeFilters" filterDisplay="row" paginator :rows="20" :rowsPerPageOptions="[10, 20, 30, 50]"

`

Capture d’écran 2024-08-22 à 12 07 12

Thanks for your help

Reproducer

none

PrimeVue version

4.0.4

Vue version

3.x

Language

ES6

Build / Runtime

Vue CLI App

Browser(s)

Chrome 127

Steps to reproduce the behavior

Just add the following lines for the existing DataTable:

paginator :rows="20" :rowsPerPageOptions="[10, 20, 30, 50]"

Expected behavior

The Datable becomes suddenly empty due to the fact that the selection list is empty the first time.

tugcekucukoglu commented 2 months ago

Could you send a reproducer?

tugcekucukoglu commented 2 months ago

We temporarily close this due to the lack of enough information. Please provide a minimal reproduction to reopen the issue. Thanks.

yhercouet commented 2 months ago

Hello, I spent 30 min creating a reproducer, all I get is a blank screen and no errors ... https://stackblitz.com/edit/primevue-4-vite-issue-template-tnrhhj?file=src%2FApp.vue

I really don't know how I can help you more ...