Vxetable 如何更新列属性，比如过滤，排序等等

        在使用vxeTable 进行二次封装表格组件时，会遇到更改表头数据从而更改列属性的变化的情况。 如果直接更改表头数据控制列是否可以排序和过滤，这样是不生效的，因为vxeTable 的列属性不是响应式的。

解决方法：可以在每次更新之前，先从表格中获取所有的列信息，然后用结构赋值的方法，将当前跟新的数据补充进列信息之后，使用。loadColumn 进行列刷新

 // 获取原始vxeTable的column 数据
            const oldColumns = xTable.value.getColumns() || [];
            const reFreshColumn = [] as any;
            // 对之前存在的数据列进行强制刷新
            tableNormalOptions.value.forEach((item: any) => {
              let temp = oldColumns.find((oldItem: any) => item.prop === oldItem.field);
              if (temp) {
                temp = {
                  ...temp,
                  ...item,
                };
                reFreshColumn.push(temp);
              }
            });
            // 对于之前存在的列进行强制刷新
            xTable.value.loadColumn(reFreshColumn);

这样仅仅只适用于只有一级表头的简单的表格，如果目标表格是一个多级表头的复杂表格，此种方式就不适用了。可以尝试使表格重新渲染的方法

<template>
<vxe-table :key=currentKey></vxe-table>
</template>
<script>
import {ref, watch, defineProps} from 'vue';
    cosnt props = defineProps({
        tableHeadOptions:{
             type:Object as any,
            default:()=>({});
       }
     })
    // 用随机数生成一个唯一key
    const currentKey = ref(Math.random())
    // watch 监听表头数据变化，更新currentKey, 从而达到表格重新渲染的效果
    watch(()=>props.tableHeadOptions,()=>{
        // props.tableHeadOptions 生成多级表头省略代码
        currentKey.value = Math.random();
})
</script>