objectSpanMethod({ row, column, rowIndex, columnIndex }) {//合并规则
//当前行row、当前列column、当前行号rowIndex、当前列号columnIndex
if (columnIndex === 0) {//第一列:参数column.property,内容:row.name,合并数量this.columnDatas[row.name]
console.log(this.columnDatas[rowIndex],column.property,row.name,"读取参数")
const _row = this.columnDatas[rowIndex];//每一列的数目:[1,2,0,1]
if (_row) {
return {
rowspan: _row,
colspan: 1
};
} else {
return {
rowspan: 0,
colspan: 0
};
}
}
},

注:目标是计算合并相同key的数量_row,而且是一个数组格式

    //合并相同key的数据data:如:this.getSpanArr(this.dataSource,"name");//[1,2,0,1]
getSpanArr(data,key) {
let spanArr = [];
let spanIndex = null;
if (data == null) {
return [];
} else {
for (let i = 0; i < data.length; i++) {
if (i === 0) {
spanArr.push(1);
spanIndex = 0;
} else {
if (data[i][key]=== data[i - 1][key]) {
spanArr[spanIndex] += 1;
spanArr.push(0);
} else {
spanArr.push(1);
spanIndex = i;
}
}
}
return spanArr;
}
},

附:常见合并key,读取value与num

    //计算相同key的数量num:{value:num},value是内容
handleSpand(data,key) {
let obj = {};
data.forEach(val => {
if (obj[val.key]) {
obj[val.key]++;
} else {
obj[val.key] = 1;
}
});
return obj;
},

自定义合并列:el-table的更多相关文章

  1. SQL 合并列值和拆分列值

    合并列值 表结构,数据如下: id value ----- ------ aa bb aaa bbb ccc 需要得到结果: id values ------ ----------- aa,bb aa ...

  2. JQuery合并列(可用于导出Word)

    在网上找了一些JQuery合并列的例子,但是都是用.hide()的方式,这样导致了在导出Word的时候表格严重变形 自己写了一个用.remove()方式的合并列 function arrangeTab ...

  3. SQL语法集锦三:合并列值与分拆列值

    本文转载http://www.cnblogs.com/lxblog/archive/2012/09/29/2708724.html 在SQL中分拆列值和合并列值老生常谈了,从网上搜刮了一下并记录下来, ...

  4. SQL(横表和纵表)行列转换,PIVOT与UNPIVOT的区别和使用方法举例,合并列的例子

    使用过SQL Server 2000的人都知道,要想实现行列转换,必须综合利用聚合函数和动态SQL,具体实现起来需要一定的技巧,而在SQL Server 2005中,使用新引进的关键字PIVOT/UN ...

  5. WMSYS.WM_CONCAT(distinct(字段名)) 函数,字符串拼接函数。合并列

    合并列函数 WMSYS.WM_CONCAT(distinct(字段名)) 函数 可以实现字符串拼接在一起,这种情况可以在要求把一个字段的多个值拼接在一起的时候使用.其中distinct可以去掉重复的值 ...

  6. Excel动态合并行、合并列

    背景: 在北京工作的时候,又一次同事问了我这样一个问题,说我要把从数据库获取到的数据直接通过NPOI进行导出,但是我对导出的格式要特殊的要求,如图: 冥思苦想,最终顺利帮同事解决问题,虽然有点瑕疵,但 ...

  7. GRIDVIEW多行多列合并单元格(合并列)

    GitHub项目地址:https://github.com/mingceng/merge-gridviewcell 去年的时候,我写了两篇文章:  GridView多行多列合并单元格(完整代码和例子) ...

  8. Oracle-单表合并列

    表基本结构 合并列 select t.student,decode(t.java,'','','java') 科目, t.java from student t union select t.stud ...

  9. sql中合并列方法

    方法一:创建合并列函数 -------创建一个方法---------- CREATE FUNCTION dbo.Role_Name(@AdminID int) ) AS BEGIN ) SET @r ...

随机推荐

  1. 参考信息 - Serverless

    初见 Serverless的本质是什么? 看懂 Serverless,这一篇就够了 关于「Serverless」的完整指南:你知道和不知道的 了解 7个开源平台,入门无服务器计算

  2. web自动化测试---自动化脚本设置百度搜索每页显示条数

    前面学的都是基础知识,本篇将进入实战练习 以百度“搜索设置”为对象进行测试用例的写作: 百度的搜索设置在首页的“设置”里面,鼠标悬停之后即可显示,如下图红框位置: 测试目标是,修改每页的显示条数为50 ...

  3. Android生成二维码--保存和分享二维码图片

    之前写过生成自定义二维码的两篇文章:<Android生成自定义二维码><Android生成二维码–拍照或从相册选取图片>,下面就介绍一下Android应用内如何保存以及分享二维 ...

  4. 单区域OSPF路由协议实现网络区域互通

    1.什么是OSPF协议? OSPF协议的全程是开放式最短路径优先协议,协议采用链路状态协议算法(LS协议) 2.OSPF vs RIP RIP路由协议是距离矢量路由选择协议,收敛速度慢,如果在一些大型 ...

  5. Django | Cookie 中文编码的问题

    在Django中,向cookie写入中文字符后会报错:如向cookie中保存用户名,当用户名存在中文字符时: Traceback (most recent call last): File , in ...

  6. Eureka安全认证

    Eureka 服务加入安全认证只需要在之前的服务中增加三处步骤即可: 1.在Eureka Server中加入spring-boot-starter-security依赖 <dependencie ...

  7. 独享锁 & 共享锁

    独享锁(互斥锁):同时只能有一个线程获得锁.比如,ReentrantLock 是互斥锁,ReadWriteLock 中的写锁是互斥锁. 共享锁:可以有多个线程同时获得锁.比如,Semaphore.Co ...

  8. 从逻辑思维中学习CSS,从宽高说起

    从宽高说起 从宽高说起,我们知道一个物体的大小是由长.宽.高三个方向的尺寸决定的,但是你想啊电脑显示器是一个平面的,而不是3维,另因网页大部分情况下只需要使用到2维,所以为了简单在CSS中只有宽和高的 ...

  9. IDEA之Git分支以及Stash使用

    访问我的博客 随着公司开发人员的增加,以及多需求的并行开发,功能上线就会碍手碍脚:害怕自己没写完的代码被别人部署到线上,害怕别人代码没写完被自己部署到线上:总之功能上线之前还要和所有开发沟通,能不能部 ...

  10. MyBatis从入门到放弃五:调用存储过程(SQLServer2012)

    前言 如果是相对于复杂的SQL逻辑我们肯定是基于存储过程开发,这篇学习下执行存储过程,调用存储过程如果参数较多我们可以创建parameterMap. 搭建开发环境 开发环境和上篇文章保持相同 创建存储 ...