DataGrid

A table of rows that supports sorting, paging and loading data from the network. Rows and columns are rendered automatically as DataGridCells and DataGridColumnHeaders.

See the WAI-ARIA guidelines for grids .

Structure

<DataGrid columns={columns} data={rows}>
	(cell content, using $slot.row / $slot.column / $slot.value)
</DataGrid>

Cells render their value as text by default. Pass children to customize the cell content; named slots provide the loading, error and empty states.

Demo