vue 数组根据键值重新排序

在Vue.js中，如果你想根据数组元素的某个键值对进行排序，你可以使用`sort()`方法，并提供一个比较函数作为参数。这个比较函数应该接收两个参数，通常是两个待比较的数组元素，然后返回一个负数、零或正数，表示第一个元素应当排在第二个元素之前、两者相等或是第一个元素应当排在第二个元素之后。

以下是一个基本的例子：

let arr = [
  { name: 'Tom', age: 20 },
  { name: 'Jerry', age: 15 },
  { name: 'Spike', age: 25 }
];

// 按照年龄升序排序
arr.sort((a, b) => a.age - b.age);

// 或者按照名字降序排序
arr.sort((a, b) => b.name.localeCompare(a.name));

// 可以传递自定义函数来适应复杂排序需求
function sortByKey(arr, key) {
  return arr.sort((a, b) => (a[key] > b[key]) ? 1 : -(a[key] < b[key]));
}

// 使用上述函数按'name'键降序排序
sortByKey(arr, 'name');

相关问题

使用vue 写出一个排序方法

可以使用Vue的计算属性来实现数组排序，实现方法如下：

<template>
  <div>
    <button @click="sortBy('name')">按名称排序</button>
    <button @click="sortBy('age')">按年龄排序</button>
    <table>
      <thead>
        <tr>
          <th>名称</th>
          <th>年龄</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in sortedList" :key="item.id">
          <td>{{ item.name }}</td>
          <td>{{ item.age }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: [
        { id: 1, name: '张三', age: 18 },
        { id: 2, name: '李四', age: 20 },
        { id: 3, name: '王五', age: 22 }
      ],
      sortKey: '',
      sortDesc: false
    }
  },
  methods: {
    sortBy(key) {
      if (this.sortKey === key) {
        this.sortDesc = !this.sortDesc
      } else {
        this.sortKey = key
        this.sortDesc = false
      }
    }
  },
  computed: {
    sortedList() {
      const key = this.sortKey
      const desc = this.sortDesc ? -1 : 1
      return this.list.sort((a, b) => {
        if (a[key] < b[key]) return -1 * desc
        if (a[key] > b[key]) return 1 * desc
        return 0
      })
    }
  }
}
</script>

在上面的代码中，我们定义了一个 `list` 数组和 `sortKey`、`sortDesc` 两个变量用于绑定排序的状态。然后，我们使用 `sortBy` 方法来切换排序的状态，如果当前的排序键值和上一次相同，则切换排序方式，否则按升序排序。在计算属性 `sortedList` 中，我们根据排序键值和排序方式对数组进行排序，然后返回排序后的结果。在模板中，我们使用 `v-for` 指令循环渲染排序后的列表。

vue的对象是ABCD，添加时向下添加key值，删除时删除选中key值同时key自动排序

首先，你需要将对象 ABCD 转化为一个数组，然后添加或删除元素会更加方便。在添加元素的时候，你可以使用 `push()` 方法将新元素添加到数组末尾，然后使用 `sort()` 方法对数组进行排序。在删除元素的时候，你可以使用 `splice()` 方法删除选中的元素，然后再次使用 `sort()` 方法对数组进行排序。以下是示例代码：

// 将对象转化为数组
let arr = Object.entries(ABCD);

// 添加新元素
arr.push(['E', valueOfE]);
arr.sort();

// 删除元素
let indexToRemove = arr.findIndex(([key, value]) => key === selectedKey);
arr.splice(indexToRemove, 1);
arr.sort();

// 将数组转化为对象
let newObj = Object.fromEntries(arr);

请注意，这个例子中的对象 ABCD 中的键值对并没有按照任何特定的顺序排列。如果你需要按照特定的顺序对键值对进行排序，你可以使用 `sort()` 方法的回调函数来自定义排序规则。