react table 根据某个字段合并多列

import { Table } from 'antd';
import { useState, useEffect } from 'react';

// 计算指定字段的合并跨度（rowSpan）
const calculateRowSpan = (data, field) => {
  if (!data.length) return [];
  const rowSpanArr = [];
  let currentValue = data[0][field]; // 当前字段值
  let count = 1; // 连续相同值的计数
  // 从第二行开始遍历
  for (let i = 1; i < data.length; i++) {
    if (data[i][field] === currentValue) {
      // 与上一行值相同，计数+1
      count++;
    } else {
      // 与上一行值不同，记录之前的计数
      for (let j = i - count; j < i; j++) {
        rowSpanArr[j] = j === i - count ? count : 0; // 起始行设置count，其余行设置0
      }
      // 更新当前值和计数
      currentValue = data[i][field];
      count = 1;
    }
  }
  // 处理最后一组连续值
  for (let j = data.length - count; j < data.length; j++) {
    rowSpanArr[j] = j === data.length - count ? count : 0;
  }
  return rowSpanArr;
};

// 存储合并跨度的数组（针对 category 字段）
const [categoryRowSpan, setCategoryRowSpan] = useState([]);
useEffect(() => {
  // 初始化时计算合并跨度
  setCategoryRowSpan(calculateRowSpan(dataSource, 'flightNo'));
}, []);