js遍历数组将数组中属性名相同的属性值组成新的数组再转化成字符串并换行(js换行和html换行不同)

           {label: '告警结果',display:true, html:true,formatter:(row)=>{let list =""if(row.funRes&&row.funRes.length){let  propName = 'value'; list= row.funRes.map(obj => {return `<span style="vertical-align: text-top;padding-right: 2px;"><img style="width: 18px;height:18px"  src="${obj[propName] ==0?'/img/newpic/icon-green.png':obj[propName] ==-1?'/img/newpic/icon-yellow.png':obj[propName] ==1?'/img/newpic/icon-red.png':obj[propName] ==2?'/img/newpic/noValue.png':""}"></span><span>${obj[propName] ==0?'正常':obj[propName]==-1?'未识别':obj[propName] ==1?'异常':obj[propName] ==2?'无阈值':'--'}</span>`})}return list&&list.length?list.join('\n'):""}},

 如上会得到这种效果

其中row.funRes就是要遍历的数组

value是要找数组中的所有属性名为value的属性值组合成数组

再使用.join转化成字符串原本使用逗号隔开但是这个使用\n去换行(这里的换行是js的换行 也就是在页面中展示时候并没有换行

于是需要检查元素 在这个元素中使用css去换行

/deep/.el-table .cell{white-space: pre-line;
}

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

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

相关文章

使用Flink SQL实时入湖Hudi/Hive

文章目录 1 Hudi 简介2 COW和MOR3 接入COW模式Hudi表4 使用Flink SQL查看新接表5 使用Hive查看新接表6 总结 1 Hudi 简介 Hudi是一个流式数据湖平台&#xff0c;使用Hudi可以直接打通数据库与数据仓库&#xff0c;连通大数据平台&#xff0c;支持对数据增删改查。Hudi还支持同…

如何应对访问国外服务器缓慢的问题?SDWAN组网是性价比之选

访问国外服务器缓慢通常由以下原因造成&#xff1a; 1、政策限制&#xff1a;我国管理互联网&#xff0c;限制部分国外网站和服务器&#xff0c;以维护国家安全稳定。 2、技术障碍&#xff1a;国内与国际互联网的网络架构和协议存在差异&#xff0c;可能导致数据传输不兼容。 …

数据结构——图的基础知识与其表示

一&#xff1a;定义 由顶点的集合和边的集合组成&#xff1b;常以 G(V,E) 表示&#xff0c;G 代表图&#xff0c;V代表 顶点的集合&#xff0c;E代表边的集合&#xff1b; 如图&#xff1a; 在G1图中&#xff0c;有 0~4 五个顶点&#xff0c;有 0-1&#xff0c;0-2&…

V23 中的新功能:LEADTOOLS 展示了它的 EXCEL-lence

LEADTOOLS (Lead Technology)由Moe Daher and Rich Little创建于1990年&#xff0c;其总部设在北卡罗来纳州夏洛特。LEAD的建立是为了使Daher先生在数码图象与压缩技术领域的发明面向市场。在过去超过30年的发展历程中&#xff0c;LEAD以其在全世界主要国家中占有的市场领导地位…

苹果自研大语言模型“Ajax“ 助力iOS 18升级;Stack Overflow与OpenAI建立API合作伙伴关系

&#x1f989; AI新闻 &#x1f680; 苹果自研大语言模型"Ajax" 助力iOS 18升级 摘要&#xff1a;苹果公司预计通过自研大语言模型Ajax来为iOS 18和Siri带来重大升级&#xff0c;但不计划推出类似ChatGPT的AI聊天机器人。Ajax模型基于Google的Jax框架&#xff0c;并…

深度学习之基于YOLOv5目标检测可视化系统

欢迎大家点赞、收藏、关注、评论啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统四. 总结 一项目简介 一、项目背景与意义 随着深度学习技术的快速发展&#xff0c;目标检测在多个领域中的应用日益广泛&#xff0c;包括…

filezilla 上传文件到服务器

1. 下载windows ftp客户端 https://filezilla-project.org/index.php 点击左侧的 Download FileZilla Client All platforms 默认安装。 2. 双击打开 filezilla 按图中填写&#xff0c;并上传。 主机名: 10.20.89.* 用户名: zhuzh 密码: *** 端口: 22 点击 快速连接&#…

中电金信:金Gien乐道 | 4月要闻速览,精彩再回顾

中国电子党组副书记、总经理李立功一行调研中电金信 4月10日&#xff0c;中国电子党组副书记、总经理李立功一行赴中电金信进行调研&#xff0c;深入听取了中电金信经营发展情况、研发工作及“源启”行业数字底座平台的汇报&#xff0c;并参观了公司展厅和科技研发场所&#xf…

hadoop---基于Hive的数据仓库相关函数机制及其优化方案

Hive相关函数&#xff08;部分&#xff09;&#xff1a; if函数: 作用: 用于进行逻辑判断操作 语法: if(条件, true返回信息,false返回信息) 注意: if函数支持嵌套使用 select if(aa,’bbbb’,111) fromlxw_dual; bbbb select if(1<2,100,200) fromlxw_dual; 200nvl函数:…

Java中的maven的安装和配置

maven的作用 依赖管理 方便快捷的管理项目依赖的资源&#xff0c;避免版本冲突问题 统一项目管理 提供标准&#xff0c;统一的项目结构 项目构建 标准跨平台&#xff08;Linux、windows、MacOS&#xff09;的自动化项目构建方式 maven的安装和配置 在maven官网下载maven Ma…

SAP-ABAP-搜索帮助03

一、搜索帮助有两种&#xff1a; 1、外键/检查表&#xff1a;基于个表的&#xff0c;数据有效性检测。 2、SE11手工创建搜索帮助&#xff1a;基于数据元素的&#xff0c;纯帮助&#xff0c;无校验。 二、创建搜索帮助 1、外键/检查表 例如学员考勤表&#xff0c;包括学院的…

拯救者杯OPENAIGC开发者大赛城市巡回沙龙,苏州站报名开启!

由联想拯救者、AIGC开放社区、英特尔联合主办的“AI生成未来第二届拯救者杯OPENAIGC开发者大赛”自上线以来&#xff0c;吸引了广大开发者的热情参与。 为了向技术开发者、业务人员、高校学生、以及个体创业人员等参赛者们提供更充分的帮助与支持&#xff0c;AIGC开放社区特别…

Linux:进程通信(二)信号的保存

目录 一、信号的处理是否是立即处理的&#xff1f; 二、信号如何保存 1、阻塞、未决、递达 2、信号集 3、信号集操作函数 4、sigprocmask函数 5、sigpending 函数 上篇文章我们讲解了信号的产生&#xff1a;Linux&#xff1a;进程信号&#xff08;一&#xff09;信号的产…

ResponseHttp

文章目录 HTTP响应详解使用抓包查看响应报文协议内容 Response对象Response继承体系Response设置响应数据功能介绍Response请求重定向概述实现方式重定向特点 请求重定向和请求转发比较路径问题Response响应字符数据步骤实现 Response响应字节数据步骤实现 HTTP响应详解 使用抓…

适用于 Windows 的免费恢复软件:前 7 个解决方案对比

Windows计算机上的数据恢复可能是一项简单或艰巨的任务&#xff0c;具体取决于您使用的软件。 软件的质量及其功能将决定将恢复多少数据、文件的完整性、扫描存储的深度以及整个过程在时间和恢复成功率方面的整体效率。 如果您想了解一些适用于 Windows的最佳免费取消删除软件…

Adobe Illustrator 2024 for Mac:矢量图形设计软件

Adobe Illustrator 2024 for Mac是一款专为Mac用户设计的行业标准矢量图形设计软件。该软件以其卓越的性能和丰富的功能&#xff0c;为设计师和艺术家们提供了一个全新的创意空间。 作为一款矢量图形软件&#xff0c;Adobe Illustrator 2024 for Mac支持创建高质量的矢量图形&a…

如何利用工作流自定义一个AI智能体

选择平台 目前已经有不少大模型平台都提供自定义智能体的功能&#xff0c;比如 百度的文心 https://agents.baidu.com/ 阿里的百炼平台 https://bailian.console.aliyun.com/。 今天再来介绍一个平台扣子&#xff08;https://www.coze.cn/&#xff09;&#xff0c;扣子是…

翔云优配官网美股市场分析问界回应M7事故四大疑问

问界再次新M7 Plus山西高速事故。 4月26日下午,山西运城曾有一辆问界新M7 Plus车辆(以下简称“事故车辆”)在高速行驶时和一辆高速洒水车追尾,碰撞后车辆起火,造成三人遇难,该事故引发了广泛关注。 翔云优配以其专业的服务和较低的管理费用在市场中受到不少关注。该平台提供了…

效率跨越式提升的工农业对机器人专业的需求

需求 需要用人的地方一定会逐步收缩。 原来需要人的地方也会逐步被机器人取代。 机器人这个专业最强的悖论就是可以部分取代人。 此处&#xff1a;用人的地方是指“工农业”&#xff0c;包括工业和农业。 机器人工程行业算制造业吗 机器人工程终身学习和工作计划 趋势 工匠…