---
meta:
  nav: Virtual tables
  title: Data table - Virtual tables
  description: The data table component is used for displaying tabular data in a way that is easy for users to scan. It includes sorting, searching, pagination and selection.
  keywords: data tables, vuetify data table component, vue data table component
related:
  - /components/data-tables/basics/
  - /components/data-tables/server-side-tables/
  - /components/tables/
features:
  github: /components/VDataTable/VDataTableVirtual.tsx
  label: 'C: VDataTableVirtual'
  report: true
---

# Data table - Virtual tables

The v-data-table-virtual component relies on all data being available locally. But unlike the standard data-table it uses virtualization to only render a small portion of the rows. This makes it well suited for displaying large data sets. It supports sorting and filtering, but not pagination.

<PageFeatures />

<PromotedEntry />

## API

| Component | Description |
| - | - |
| [v-data-table-virtual](/api/v-data-table-virtual/) | Primary Component |

<ApiInline hide-links />

## Examples

### Basic example

<ExamplesExample file="v-data-table/virtual" />

When customizing rows with the `#item` slot, you must bind the provided `itemRef` to your `<tr>`. This ensures that the virtual scroller can correctly measure and recycle rows.

<ExamplesExample file="v-data-table/virtual-custom" />

### Expanded rows

The `expanded-row` slot may hold any number of rows. Use `v-data-table-row` instead of plain `<tr>` for rows that should line up with the parent columns.

<ExamplesExample file="v-data-table/virtual-expanded-rows" />
