antdvue table 手动更改defaultSortOrder从descend改为asend 高亮按钮不变

如果你想手动更改antdvue table的defaultSortOrder属性，你可以通过以下步骤实现：

1. 在table组件中添加defaultSortOrder属性，将其初始值设置为"descend"，即降序排序。

<template>
  <a-table :columns="columns" :data-source="data" :default-sort-order="'descend'">
    // ...
  </a-table>
</template>

2. 在需要更改排序方式的按钮上添加点击事件，并在事件处理函数中使用this.$refs.table.sortData()方法手动对数据进行排序。

<template>
  <div>
    <button @click="changeSortOrder">Change Sort Order</button>
    <a-table :columns="columns" :data-source="data" :default-sort-order="'descend'" ref="table">
      // ...
    </a-table>
  </div>
</template>

<script>
export default {
  // ...
  methods: {
    changeSortOrder() {
      // 获取当前的排序规则
      const sortOrder = this.$refs.table.sortOrder;
      // 如果当前是降序，将排序规则改为升序
      if (sortOrder === "descend") {
        this.$refs.table.sortOrder = "ascend";
      } else { // 否则改为降序
        this.$refs.table.sortOrder = "descend";
      }
      // 手动排序
      this.$refs.table.sortData();
    },
    // ...
  },
};
</script>

3. 在changeSortOrder方法中，根据当前的排序规则，手动更改排序规则并调用this.$refs.table.sortData()方法对数据进行排序。

注意：在更改排序规则后，表格头部的排序箭头不会自动切换方向，需要手动添加样式来实现。你可以在表头的样式中添加伪类选择器，根据当前排序规则来添加样式，例如：

.ant-table-column-sorter-up.active {
  color: #1890ff;
}

.ant-table-column-sorter-down.active {
  color: #1890ff;
}

其中，".active"类表示当前排序状态，你可以根据实际情况来调整样式。