Vue的table组件合并行方法

/*** @param {Array} data - 原始数据集合* @param {string} addParamer - 这个是自定义的参数,向每个对象中添加一个参数 按照这个参数的个数进行合并* @param {} args - 剩余参数 这个是合并规则 ,比如按照时间合并 那就传入对象中的时间参数date, 如果有多个规则 例如同个时间内同一性别 那就传入date,sex,多个参数逗号隔开*/
function mergeColunm(data, addParamer, ...args) {// 计算合并的数量let count = 0// 获取相同的let sameTimePerson = JSON.parse(JSON.stringify(data[0]))// 获取相同的条件的个数let sameTimePersonArray = []let samePersonIds = [];for (let i = 0; i < data.length; i++) {const currentPerson = data[i]let isSame = isSameValueWithKey(sameTimePerson, currentPerson, args)if (isSame) {count++samePersonIds.push(currentPerson.id)} else {// 把之前统计的数据添加到数组sameTimePerson[addParamer] = countsameTimePerson.samePersonIds = samePersonIdssameTimePersonArray.push(sameTimePerson)/// 置空ID数组samePersonIds = []// 把当前数据ID添加进数组samePersonIds.push(currentPerson.id)// 重置数据count = 1sameTimePerson = JSON.parse(JSON.stringify(currentPerson))}// 把最后一个数据放入数组if (i == data.length - 1) {sameTimePerson[addParamer] = countsameTimePerson.samePersonIds = samePersonIdssameTimePersonArray.push(sameTimePerson)}}data.forEach(item => {item[addParamer] = 0for (let i = 0; i < sameTimePersonArray.length; i++) {let p = sameTimePersonArray[i]let isSame = isSameValueWithKey(item, p, args)if (isSame && p.samePersonIds.indexOf(item.id) !== -1) {const findIndex = data.findIndex(subItem => {let isSame = isSameValueWithKey(subItem, p, args)return isSame && p.samePersonIds.indexOf(subItem.id) !== -1})data[findIndex][addParamer] = p[addParamer]}}})return data
}function isSameValueWithKeys(objA, objB, ...args) {if (args.length === 0) {console.error('请传入对象 Key 来获取value值')return false}for (let key of keys) {if (!(key in objA) || !(key in objB)) {console.error('传入的Key不存在对象中')return false}if (objA[key] !== objB[key]) {return false;}}return true;
}

使用方法

这里以iView的Table组件为例。这里我们按照时间相同合并,并把计算的数量放在count里边。注意这里的返回值

<template><Table :data="resultData" border :span-method="handleSpan"></Table>
</template>
// 这里我们调用合并的方法,按照date相同的进行合并,并使用count作为统计数量
// data是原始数据   resultData是处理后带有count的数据 把这个数据绑定在table上
let resultData = mergeColunm(data, 'count', 'date')// 在这里返回想要合并的方式
handleSpan({row, column, rowIndex, columnIndex}) {// 假如我们想合并第四列 时间相同的行 那么就这样写if (columnIndex === 3) {return [row.count, 1];} 
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/732842.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

String StringBuffer StringBuilder StringJoiner区别

String、StringBuffer、StringBuilder和StringJoiner在Java中都是处理字符串的工具&#xff0c;但它们各自有不同的特点和适用场景。 String: 是不可变的字符序列&#xff0c;一旦创建就不能更改其内容。每次对String进行修改时&#xff0c;实际上会生成一个新的String对象。这…

机器人期刊:Science Robotics and IEEE Transactions

文章目录 1. Science Robotics (出版商 AAAS)2. IEEE Transactions on RoboticsReference1. Science Robotics (出版商 AAAS) https://www.science.org/journal/scirobotics 2. IEEE Transactions on Robotics

10kV/35kV并网分布式光伏系统-实现错峰有序用电

根据国家电网 Q/GDW1480-2015 《分布式电源接入电网技术规定》&#xff1a;分布式电源并网电压等级可根据各 并网点装机容量进行初步选择&#xff0c;推荐如下&#xff1a; • 8kW 及以下可接入 220V &#xff1b; • 8kW~400kW 可接入 380V &#xff1b; • 400kW~60…

Solidity Uniswap V2 Pair中交换Token

交换意味着使用一定数量的TokenA来换取Tokenb。但我们需要一些额外的辅助服务: 1.提供实际汇率。 2.保证所有的交易都是在正确的汇率下进行的。 GitHub - XuHugo/solidityproject: DApp go go go &#xff01;&#xff01;&#xff01; 我们在研究流动性供应时学到了一些关于 D…

【Appium问题】每次启动appium都会安装一次uiautomator

问题 每次启动appium&#xff0c;都需要安装一次uiautomator2比较麻烦 解决 在配置文件capabilities 中增加参数skipServerInstallationTrue

【C++专栏】C++入门 | 函数重载、引用、内联函数

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;C专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ C入门 | 函数重载、引用、内联函数 文章编号&#xff1a;C入门 / 02 文…

mongodb的备份与恢复

查询语句 show dbs use leshusanguo show tables db.user.find() db.user.find({},{uid:1,nickname:1,max_level:1}) db.user.find({max_level:1},{uid:1,nickname:1,max_level:1}) db.user.count() db.user.find({max_level:1,uid:672064,},{uid:1,nickname:1,max_level:1}) …

Docker的奇幻漂流

航海日志&#xff1a;Docker的奇幻漂流 欢迎各位探险家们&#xff0c;今天我们将启航进入一个由容器构成的神秘海域——Docker。在这个由代码构建的奇妙世界里&#xff0c;我们将学习如何驾驭这些名为“容器”的神奇船只。准备好了吗&#xff1f;让我们扬帆起航&#xff0c;探…

ORACLE RAC反应卡顿时enq: SV - contention和latch: row cache objects的分析

某客户数据库系统使用ORACLE RAC 11G版本&#xff0c;两个节点。在上午8点钟之后&#xff0c;业务开始大量进行时&#xff0c;出现严重的卡顿问题&#xff1b;在工程师分析后&#xff0c;发现当时出现了很多异常等待数据&#xff0c;如典型的enq: SV - contention 、enq: TX - …

基于单片机的老人防丢系统设计

目 录 摘 要 I Abstract II 引 言 3 1 系统总体架构 6 1.1方案设计与选择 6 1.2 系统架构设计 6 1.3 系统器件选择 7 2 系统硬件设计 9 2.1 单片机外围电路设计 9 2.2 LCD1602液晶显示电路设计 12 2.3 短信模块电路设计 14 2.4 GPS模块电路设计 14 2.5 电源与按键控制电路设计…

用 reduce 实现 map 的功能

Array.prototype.map function (callback) {const array this;return array.reduce((acc, cur, index) > {acc.push(callback(cur, index, array));return acc;}, []); }; 测试&#xff1a; var m [1, 2, 3, 4, 5].map(function (v, i, arr) {return v v; }); console…

精读《深度学习 - 函数式之美》

1 引言 函数式语言在深度学习领域应用很广泛&#xff0c;因为函数式与深度学习模型的契合度很高&#xff0c;The Beauty of Functional Languages in Deep Learning — Clojure and Haskell 就很好的诠释了这个道理。 通过这篇文章可以加深我们对深度学习与函数式编程的理解…

使用Python合并PDF文件并添加自定义目录及页脚

如何用Python合并PDF文件并添加自定义目录及页脚 步骤一&#xff1a;准备环境步骤二&#xff1a;合并PDF文件步骤三&#xff1a;处理特定文件步骤四&#xff1a;合并并添加目录与页脚步骤五&#xff1a;保存最终文档结语完整代码 在处理文档时&#xff0c;我们经常遇到需要合并…

Mybaties-Plus saveBatch()、自定义批量插入、多线程批量插入性能测试和对比

一.背景 最近在做一个项目的时候&#xff0c;由于涉及到需要将一个系统的基础数据全量同步到另外一个系统中去&#xff0c;结果一看&#xff0c;基础数据有十几万条&#xff0c;作为小白的我&#xff0c;使用单元测试&#xff0c;写了一段代码&#xff0c;直接采用了MP(Mybati…

element---tree树形结构(返回的数据与官方的不一样)

项目中要用到属性结构数据&#xff0c;后端返回的数据不是官方默认的数据结构&#xff1a; <el-tree:data"treeData":filter-node-method"filterNode":props"defaultProps"node-click"handleNodeClick"></el-tree>这是文档…

SpringCloudGateway全局过滤器

文章目录 全局过滤器的作用自定义全局过滤器过滤器执行的顺序 上一篇 Gateway理论与实践 介绍的过滤器&#xff0c;网关提供了31种&#xff0c;但每一种过滤器的作用都是固定的。如果我们希望拦截请求&#xff0c;做自己的业务逻辑则没办法实现。 全局过滤器的作用 全局过滤器的…

怎样添加、移除、移动、复制、创建和查找节点?

1&#xff09;创建新节点 createDocumentFragment() //创建一个 DOM 片段createElement() //创建一个具体的元素createTextNode() //创建一个文本节点 2&#xff09;添加、移除、替换、插入 appendChild() //添加removeChild() //移除replaceChild() //替换insertBefore() /…

高级语言讲义2010计专(仅高级语言部分)

1.编写一程序&#xff0c;对输入的正整数&#xff0c;求他的约数和。 如&#xff1a;18的约数和为1236939 #include <stdio.h>int getsum(int n){int i,sum0;for(i1;i<n;i)if(n%i0)sumi;return sum; } int main(){int sum getsum(18);printf("%d",sum); …

JS直接量及其相关对象

什么是直接量 直接量是指不需要创建对象就可以直接使用的变量。ES中的直接量主要有三种类型&#xff1a;表示字符串的string类型、表示数字的number类型和表示true/false的boolean类型。当我们直接将值赋给变量后&#xff0c;ES就会自动判断其类型&#xff0c;而且当参数发生变…

Android14之编译输出system/product/vendor/odm分区(一百九十一)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…