随手记:ul-table表格合并方法

 方法两个参数:data:表格绑定的list,prop:判断的字段

例如:
 <el-table :data="commodityList"  :span-method="commodityTable">

   省略内容......

 </el-table>

    // 商品信息合并单元格

    commodityTable({ row, column, rowIndex, columnIndex }) {

      if(columnIndex === 1 || columnIndex === 2) {

        // 查找相同处方id合并

        let spanNumber = this.getSpanNumber(this.commodityList, 'prescriptionId');

        return {

          rowspan: spanNumber[rowIndex],

          colspan: 1,

        }

      }

    },

//获取要合并的行数

    getSpanNumber(data, prop) {

      let length = Array.isArray(data) ? data.length : 0;

      if (length > 0) {

        //用于标识位置

        let position = 0;

        //用于对比的数据

        let temp = data[0][prop];

        //要返回的结果

        let result = [1];

        //假设数据是AABCC,我们的目标就是返回20120

        for (let i = 1; i < length; i++) {

          if (data[i][prop] == temp) {

            //标识位置的数据加一

            result[position] += 1;

            //当前位置添0

            result[i] = 0;

          } else {

            //不相同时,修改标识位置,该位置设为1,修改对比值

            position = i;

            result[i] = 1;

            temp = data[i][prop];

          }

        }

        //返回结果

        return result;

      } else {

        return [0];

      }

    },

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

peachSoda7

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值