Sorting

Click column headers to sort. Each click adds a sort level when multi-sort is enabled.

Single Column

Name

Department

Salary

100 rows

Enable sorting with a single prop:

const { sorting } = useVirtualTable({
  data,
  columns,
  enableSorting: true,
});

Multi-Column

Name

Department

Salary

100 rows · Click columns to multi-sort

Click another header to add a secondary sort:

const { sorting } = useVirtualTable({
  data,
  columns,
  enableSorting: true,
  enableMultiSort: true,
});

// Controlled:
const [sorting, setSorting] = useState([]);
useVirtualTable({
  sorting,
  onSortingChange: setSorting,
});

Options

Option	Type	Default
`enableSorting`	`boolean`	`false`
`enableMultiSort`	`boolean`	`false`
`sorting`	`SortingState`	—
`onSortingChange`	`(state) => void`	—