vxe-table表头分组

VxeTable是Vue的一个表格组件，它支持表头的分组功能。通过这个特性，你可以将相关的列组合在一起，并在表头显示为一个可展开或收缩的组。在配置方面，通常需要设置`groupHeader`属性来指定每个组的标题，`expanded`可以控制默认是否展开分组，而`expand`事件则可以在用户交互时动态切换展开状态。

例如，一个简单的表头分组示例可能看起来像这样：

<vxe-table :data="tableData" :columns="tableColumns">
  <template v-slot:group="{ header, expanded }">
    <template slot-scope="{ row }">
      <div class="group-header">{{ header }}<span class="toggle-icon" @click="expanded = !expanded"></span></div>
      <vxe-table :data="row.groupedData" :columns="header.columns" :expanded="expanded"></vxe-table>
    </template>
  </template>
</vxe-table>

在这个例子中，`tableColumns`是一个数组，其中包含一些列定义和分组规则。当数据源`tableData`中的某个字段满足分组条件时，就会按照这个规则进行分组展示。