elemnt-ui的el-table在table中合并某个字段相同的项（vue3）

1、el-table添加span-method

<el-table :data="table_data" id="out-table" :span-method="objectSpanMethod" style="width: 100%">
...
</el-table>

2、合并的方法

  const objectSpanMethod = ({ row, column, rowIndex, columnIndex }) => {

      if (columnIndex === 1) {

        const _row = flitterData(state.tableData.records).one[rowIndex]

        return {

        rowspan: _row,

        colspan: 1,

        }

      }

    }

    const flitterData = (arr)=>{

      let spanOneArr = [],

        spanTwoArr = [],

        concatOne = 0

        arr.forEach((item, index) => {

          if (index === 0) {

          spanOneArr.push(1)

          spanTwoArr.push(1)

          } else {

          // 只需要将 span_name 修改为自己需要合并的字段名即可

          if (item.districtTeamName === arr[index - 1].districtTeamName) {

            //第一列需合并相同内容的判断条件

            spanOneArr[concatOne] += 1

            spanOneArr.push(0)

          } else {

            spanOneArr.push(1)

            concatOne = index

          }

          }

        })

      return {

        one: spanOneArr,

      }

    }