Single field sorting

Use sort-by and sort-type to determine the initial sorting field and sorting type ('asc' or 'desc').

Set sortable property to true in a header items to make the corresponding columns sortable.

Example

<template>
  <EasyDataTable
    :headers="headers"
    :items="items"
    :sort-by="weight"
    :sort-type="desc"
  />
</template>

<script lang="ts" setup>
const sortBy = "weight";
const sortType = "desc";

const headers: Header[] = [
  { text: "WEIGHT (lbs)", value: "weight", sortable: true},
  ...
];
...
</script>

Edit on CodeSandboxopen in new window

PLAYERTEAMNUMBERPOSITIONHEIGHTWEIGHT (lbs)LAST ATTENDEDCOUNTRY
Lebron JamesLAL6F6-9250St. Vincent-St. Mary HS (OH)USA
Giannis AntetokounmpoMIL34F6-11242FilathlitikosGreece
Kevin DurantBKN7F6-10240Texas-AustinUSA
Stephen CurryGSW30G6-2185DavidsonUSA
Last Updated:
Contributors: HC200ok