Table - Virtual Scroll

In scenarios with large data volumes, virtual scrolling technology only renders rows within the visible area, significantly improving table performance.

Vertical Virtual Scroll

Set virtual-config with enabled: true to enable virtual scroll, together with height to fix the table height. It automatically takes effect when data exceeds 100 records.

Vertical Virtual Scroll (10,000 records)

Custom Row Height

Set virtual-config.rowHeight to set the row height for virtual scroll, ensuring accurate scrollbar calculation. Supports fixed number or function (dynamic row height).

Custom Row Height

Frozen Columns + Virtual Scroll

Virtual scroll can work together with fixed columns (fixed), ensuring key columns on both sides are always visible.

Fixed Columns + Virtual Scroll

Sort & Filter

Virtual scroll is fully compatible with sorting and filtering. Sorting and filtering are done in memory, virtual scroll is only responsible for rendering optimization.

Sort + Filter + Virtual Scroll

With Grouped Header

Virtual scroll can work with multi-level headers (children) to support large data rendering with grouped headers.

Group Header + Virtual Scroll

Million-Row Data

With virtual scroll, even million-level data volume can maintain smooth scrolling experience.

Million-Level Data

API

VirtualConfig

Passed through virtual-config property.

Property	Description	Type	Default
enabled	Enable virtual scroll	boolean	false
rowHeight	Row height (fixed or function)	number | ((row, rowIndex) => number)	48
buffer	Buffer rows (extra rows rendered above/below)	number	5
overscan	Overscan rows	number	3
columnVirtual	Enable column virtualization	boolean	false
columnBuffer	Column buffer count	number	3

Methods (Called via ref)

Method	Description	Parameters
scrollTo	Scroll to position	({ top?, left?, row?, rowIndex? })
refresh	Refresh virtual scroll (call after data changes)	—
doLayout	Recalculate table layout	—

Notes

1. Must set height: Virtual scroll requires a fixed container height to calculate the visible area.
2. Must set row-key: Virtual scroll relies on unique row identifiers for rendering tracking.
3. rowHeight must be accurate: Virtual scroll calculates scroll position and visible range based on row height; inaccurate settings may cause scrollbar jumping.
4. Data volume threshold: Virtual rendering is only enabled when data exceeds 100 records by default; normal rendering when less than 100.
5. Compatibility: Virtual scroll is fully compatible with sorting, filtering, fixed columns, grouped headers, and other features.