problem with virtual pagination height about vue-tables-2 HOT 6 CLOSED

Yes, for records to be loaded the items per page must exceed the table viewport, so if you want the table to span the entire height of the viewport you need to set a per page accordingly.

from vue-tables-2.

Thanks for raising the issue. I have added VueTables__wrapper to the latest version (0.4.1). Alternatively, you can target table-responsive on the current version (0.4.0). I have updated the docs with an additional CSS rule, namely overflow-y: scroll, which appears to be necessary for tailwind. Tested locally and it seems to work.

from vue-tables-2.

thank you very much for the input, I still have trouble with some logic

some tests:

.table-responsive {
  /* @apply h-screen; */
  /* @apply h-4/5; */
  max-height: 500px; // even 1500px;
  @apply overflow-y-scroll;
}

while the behavior is slightly different I still have the issue on first page load.
are you aware of any trick to expand the table height on initial page load to take the entire viewport?

from vue-tables-2.

I think this should do the trick:

min-height: calc(100vh - 100px); // or whatever you want to deduct from total viewport height

from vue-tables-2.

thanks for another input, I tried but I cannot get it work properly, maybe I need to recheck the classes of my other containers.

given that this issue might not be 100% of vue-tables-2 can I reach you on xscode for that support hour? thanks, feel free to close in case.

from vue-tables-2.

for the record this is what happens with the min-height calculation, it's very close to what I'm trying to do but records are not loaded, maybe just up perPage at this point?

from vue-tables-2.