Vue按表中选定属性对对象数据进行排序

data() {
  return {
    items: [
      { name: 'John', age: 25 },
      { name: 'Alice', age: 30 },
      { name: 'Bob', age: 20 }
    ],
    sortBy: 'name' // 表中选定的属性，初始值为'name'
  };
}

computed: {
  sortedItems() {
    return this.items.sort((a, b) => {
      if (a[this.sortBy] < b[this.sortBy]) return -1;
      if (a[this.sortBy] > b[this.sortBy]) return 1;
      return 0;
    });
  }
}

<table>
  <thead>
    <tr>
      <th @click="sortBy = 'name'">Name</th>
      <th @click="sortBy = 'age'">Age</th>
    </tr>
  </thead>
  <tbody>
    <tr v-for="item in sortedItems" :key="item.name">
      <td>{{ item.name }}</td>
      <td>{{ item.age }}</td>
    </tr>
  </tbody>
</table>