如何使用v-data-table保留表格内容和排序

<template>
  <v-data-table
    :headers="headers"
    :items="data"
    :sort-by="sortBy"
    :sort-desc="sortDesc"
    :item-key="itemKey"
    :footer-props="{
      'items-per-page-options': [5, 10, 15],
      'show-current-page': true,
      'show-first-last-page': true
    }"
  >
    <template v-slot:item.actions="{ item }">
      <v-icon small @click="editItem(item)">mdi-pencil</v-icon>
      <v-icon small @click="deleteItem(item)">mdi-delete</v-icon>
    </template>
  </v-data-table>
</template>

<script>
export default {
  data() {
    return {
      headers: [
        { text: 'ID', value: 'id' },
        { text: 'Name', value: 'name' },
        { text: 'Age', value: 'age' },
        { text: 'Actions', value: 'actions', sortable: false }
      ],
      data: [
        { id: 1, name: 'John', age: 25 },
        { id: 2, name: 'Jane', age: 30 },
        { id: 3, name: 'Bob', age: 35 }
      ],
      sortBy: 'id',
      sortDesc: false,
      itemKey: 'id'
    }
  },
  methods: {
    editItem(item) {
      // 编辑数据逻辑
    },
    deleteItem(item) {
      // 删除数据逻辑
    }
  }
}
</script>