#ScrollArea + stickey header Table

4 messages · Page 1 of 1 (latest)

halcyon nexus
#

I cant get ScrollArea to work properly with stickey header Table Infinite scroll

lost jasperBOT
#

Hi @halcyon nexus. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

The knowledge sources you provided don’t contain anything about ScrollArea, sticky table headers, or infinite scroll in a Nuxt context, so I can’t give you a concrete, source‑based solution for your exact setup.

What is covered in the sources is scroll behavior in Nuxt in general (e.g. preserving scroll position on navigation or reload) and some layout issues with sticky/positioned elements (like Vuetify navigation drawers) when the viewport changes size, but nothing about a scrollable container with a sticky table header and infinite scrolling logic. [scroll behavior; navigation layout]

Because of that, I’m not able to reliably explain why your ScrollArea + sticky header + infinite scroll combination is failing, nor suggest a code fix, without going beyond the provided information.

If you’d like more targeted help within these constraints, please share:

  • The Nuxt version (2 or 3) and UI library (e.g. Vuetify, PrimeVue, custom).
  • The template and CSS for:
    • The scroll container (ScrollArea or equivalent),
    • The table (especially the header),
    • The infinite scroll trigger (e.g. an event or intersection observer).
  • A brief description of what actually happens vs what you expect (e.g. header scrolls away, infinite scroll never fires, etc.).

With that concrete code in the question, I can at least relate any scroll/layout behavior back to the Nuxt scroll handling that is documented in the sources.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@halcyon nexus Kapa.ai is still learning and improving, please let me know how I did by reacting below.