记录antd for vue table表格 后端返回来的数据合并单元格

在columns中定义customRender，通过mergeCells函数改变返回的数据

const columns: TableColumnsType = [
  {
    title: "姓名",
    dataIndex: "user_name",
    width: 50,
    align: "center",
    key: "user_name",
    customRender: ({ text, record, index }) => {
      const obj = {
        children: text !== null ? text : '',
        props: {} as any,
      }
      obj.props.rowSpan = mergeCells(text, weeklyData.value, 'user_name', index)
      console.log(obj)
      return obj
    }
  },
  ]

定义mergeCells函数

const mergeCells = (text, data, key, index) => {

  // 上一行该列数据是否一样
  if (index !== 0 && text === data[index-1][key]) {
    return 0
  }
  let rowSpan = 1
  // 判断下一行是否相等
  for (let i = index + 1; i < data.length; i++) {
    if (text !== data[i][key]) {
      break
    }
    rowSpan++
    console.log(rowSpan)
  }
  // console.log(rowSpan)
  return rowSpan
}