vue3的antd合并表格

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    tel: '0571-22098909',
    phone: 18889898989,
    address: 'New York No. 1 Lake Park',
  },
  {
    key: '2',
    name: 'Jim Green',
    tel: '0571-22098333',
    phone: 18889898888,
    age: 42,
    address: 'London No. 1 Lake Park',
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    tel: '0575-22098909',
    phone: 18900010002,
    address: 'Sidney No. 1 Lake Park',
  },
  {
    key: '4',
    name: 'Jim Red',
    age: 18,
    tel: '0575-22098909',
    phone: 18900010002,
    address: 'London No. 2 Lake Park',
  },
  {
    key: '5',
    name: 'Jake White',
    age: 18,
    tel: '0575-22098909',
    phone: 18900010002,
    address: 'Dublin No. 2 Lake Park',
  },
];

数据格式

需要合并列或者行 

    const rowSpans = (key: any) => {
      let arrs: any = [];
      // console.log(data.value, 22000);
      data.value.forEach((it: any) => {
        let arr = it
            .reduce((result: any, item: any) => {
              if (result.indexOf(item[key]) < 0) {
                result.push(item[key]);
              }
              return result;
            }, []).reduce((result: any, keys: any) => {
              const children = it.filter((item: any) => item[key] === keys);
              result = result.concat(
                  children.map((item: any, index: any) => ({
                    ...item,
                    [`${key}RowSpan`]: index === 0 ? children.length : 0
                  }))
              );
              return result;
            }, []);
        arrs.push(arr);
      });
      data.value = arrs;
    };

最后在colums上加 具体看官网

antd 2.28可以用下面的

customRender: ({value, record, index}: any) => {
  const obj = {
    children: value,
    props: {} as any
  };
  obj.props.rowSpan = record.memoRowSpan;
  return obj;
}

antd3以上，使用这个

customCell: (record:any, index:any) => {
  return {rowSpan:record.contentRowSpan}
},