Skip to main content
Vuetify0 Logo
Theme
Mode
Palettes
Accessibility
Vuetify One
Sign in to Vuetify One

Access premium tools across the Vuetify ecosystem — Bin, Play, Studio, and more.

Not a subscriber? See what's included

Virtualizer API

Headless virtualized list that renders only the items within (and slightly beyond) the visible viewport.

Explore these related pages for additional context and usage patterns.

PageCategory
VirtualizerData
createVirtualData
Data TableData

Virtualizer.Root

Props

items

readonly T[] | undefined

The items to virtualize

Default: []

itemHeight

number | `${number}` | null | undefined

The height of each item, in pixels (a number or numeric string). Used as the initial estimate for unmeasured items

height

string | number | undefined

Height of the scroll container; numbers and unitless numeric strings are pixels, other strings pass through as CSS

overscan

number | undefined

Extra items rendered outside the viewport for smoother scrolling (default: 5)

Default: 5

direction

any

The direction of scrolling (default: 'forward')

Default: "forward"

anchor

any

How scroll position is preserved across data changes (default: 'auto')

Default: "auto"

anchorSmooth

boolean | undefined

Whether anchor restoration scrolls smoothly (default: true)

Default: true

topThreshold

number | undefined

Pixels from the top edge within which top fires (default: 0)

Default: 0

bottomThreshold

number | undefined

Pixels from the bottom edge within which bottom fires (default: 0)

Default: 0

momentum

boolean | undefined

Enable iOS momentum scrolling (default: auto-detected)

elastic

boolean | undefined

Enable elastic overscroll (default: auto-detected)

namespace

string | undefined

Namespace for context provision

Default: "v0:virtualizer:root"

Events

top

[distance: number]

bottom

[distance: number]

Slots

default

VirtualizerRootSlotProps<T>

Virtualizer.Item

Props

index required

number

The item's index within the full (unvirtualized) list

namespace

string | undefined

Namespace for context injection from parent Virtualizer.Root

Default: "v0:virtualizer:root"

Slots

Virtualizer.Spacer

Props

edge

"start" | "end" | undefined

Which off-screen range this spacer reserves. start is the rows above the window; end is the rows below it

Default: "start"

namespace

string | undefined

Namespace for context injection from parent Virtualizer.Root

Default: "v0:virtualizer:root"

Slots

default

VirtualizerSpacerSlotProps
Was this page helpful?

© 2016-1970 Vuetify, LLC
Services
Ctrl+/