table合并列

import React, { useState, useEffect, useRef } from 'react';
import {
  Table, Button, Tooltip, Modal,
} from 'antd';
const Index = () => {
  const listData = [{
    skuId: '143621',
    skuName: '无线产品7',
    storeName: 'pb顺丰仓',
    options: [{
      tax_included: 29.75,
      tax_excluded: 26.33,
    }, {
      tax_included: 28.75,
      tax_excluded: 25.33,
    }, {
      tax_included: 27.75,
      tax_excluded: 24.33,
    }]
  }, {
    skuId: '143621',
    skuName: '无线产品7',
    storeName: 'pb来广营仓',
    options: [{
      tax_included: 29.75,
      tax_excluded: 26.33,
    }]
  }]
  const handleDataSource = (listData) => {
    let newArr = [];
    listData.forEach(listDataItem => {
      const len = listDataItem.options.length;
      listDataItem.options.forEach((optionsitem, index) => {
        newArr.push({
          ...listDataItem,
          ...optionsitem,
          rowSpan: index === 0 ? len : 0  // 各自的rowSpan计算出来放入对象
        })
      })
    })
    return newArr;
  };
  const columns = [
    {
      title: '序号',
      dataIndex: 'skuId',
      key: 'skuId',
      render: (text, record, index) => {
        return {
          children: text,
          props: {
            rowSpan: record.rowSpan
          }
        };
      }
    },
    {
      title: 'sku名称',
      dataIndex: 'skuName',
      key: 'skuName',
      render: (text, record, index) => {
        return {
          children: text,
          props: {
            rowSpan: record.rowSpan
          }
        };
      }
    },
    {
      title: '仓库名称',
      dataIndex: 'storeName',
      key: 'storeName',
      render: (text, record, index) => {
        return {
          children: text,
          props: {
            rowSpan: record.rowSpan
          }
        };
      }
    },
    {
      title: '含税',
      dataIndex: 'tax_included',
      key: 'tax_included',
    },
    {
      title: '不含税',
      dataIndex: 'tax_excluded',
      key: 'tax_excluded',
    },
  ]]
  return (
    <div className="order-list">
      <div className="table-box">
        <Table
          bordered
          rowKey="issueId"
          columns={columns}
          dataSource={handleDataSource(listData)}
        />
      </div>
    </div>
  );
};

export default Index;