element table 合并同类项并输出后台返回数据
table的样式如下

后台返回的数据格式是按照横着来的,因为表头是经过处理的,而且是作为独立出来的数据返给前端的,所以当我们进行数据填充的时候需要用到后台返回的完整的数据,要想一一对应的话,我们需要进行一下转化,转化方式如下:
res.content.data.map(it = > {
it.dataList.map((item, i) = > {
it[item.month + item.year] = item.indexValue;
});
});
将indexValue对应的值,赋值给一个新的变量,为了保证变量的唯一性,就将月份和年份加在一起,保证其唯一性,然后再页面中的输出是这样的:
<el-table-column
class-name="right-money"
v-for="(item,index) in colDefList"
min-width="84"
:key="index"
:label="item.year + '年'"
>
<template>
<el-table-column
width="140"
:key="index"
v-for="(it, index) in item.origin"
:label="changeValue(it.month)"
:prop="it.month + it.year"
></el-table-column>
</template>
</el-table-column>
changeValue方法是对月份展示的一个处理,这样就可以正确输出数据了
element table 合并同类项并输出后台返回数据的更多相关文章
- 后台返回数据为map集合,前端js处理方法
当后台返回的数据不是json而是map集合的时候,前端js中处理就将其看作是一个数组,例如后台返回的代码入下: Map<String, String> result = new HashM ...
- 后台返回数据判断是http还是后台本地图片 indexOf
今天的笔记呢,记录一下 其实这个应该后台去判断的,但是因为某种原因,今天我们前台做一下判断 事情是这样的,后台返回我一个url 这个url有的http开头的 也有他后台本地的例如:/img/1.pn ...
- AFN请求后台返回数据为NSInlineData类型的处理
在利用AFN进行数据解析时出现返回数据为 <7b227374 61747573 223a302c 226d6573 73616765 223a22e6 82a8e79a 84e6898b e69 ...
- 后台返回数据事null时怎么进行判断
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #454545 } p. ...
- 如何利用fis3来模拟后台返回数据
Node 版本要求 0.8.x,0.10.x, 0.12.x,4.x,6.x,不在此列表中的版本不予支持.最新版本 node 支持会第一时间跟进,支持后更新支持列表 1.安装fis3 npm inst ...
- jquery输出ajax返回数据中的时间戳转化为日期时间的函数
//第一种 function getLocalTime(nS) { ).toLocaleString().replace(/:\d{,}$/,' '); } alert(getLocalTime()) ...
- 前端模拟后台返回数据之Mockjs
一.官方文档: https://github.com/nuysoft/Mock/wiki/Syntax-Specification 例子:http://mockjs.com/examples.html ...
- 后台返回数据为treeList结构,如何添加属性(递归添加属性)
给tree形json数据添加默写属性(递归)addAttr(data){ for (var j = 0; j < data.length; j++) { data[j].title = data ...
- ajax中的后台返回数据data的意义
- 怎么解析后台返回数据中\r\n换行
给div添加css样式, white-space: pre-wrap; 即可 文章来源:刘俊涛的博客 欢迎关注公众号.留言.评论,一起学习. _________________________ ...
随机推荐
- ComfyUI 基础教程(三) —— 应用 Controlnet 精准控制图像生成
一.前言 你是否有见过下面类似这样的图片: 看起来平平无奇,当你站远点看,或者把眼睛眯成一条缝了看,你会发现,这个图中藏有一些特别的元素.这就是利用了 Ai 绘画中的 ControlNet,实现对图片 ...
- ubuntu 20.04安装GCC G++ 6.2,支持c++ 14
1. 下载源码包 wget http://ftp.gnu.org/gnu/gcc/gcc-6.2.0/gcc-6.2.0.tar.bz2 2. 解压 tar jxf gcc-6.2.0.tar.bz2 ...
- Goby 漏洞发布|(CVE-2024-45195)Apache OFBiz /viewdatafile 代码执行漏洞【已复现】
漏洞名称:Apache OFBiz /viewdatafile 代码执行漏洞(CVE-2024-45195) English Name:Apache OFBiz /viewdatafile Code ...
- Redis、Nginx、SQLite、Elasticsearch等开源软件成功的原因及他们对IT技术人员的启示
引言 这些年在自研产品,对于如何做好产品进行了一些思考.随着开源软件的蓬勃发展,许多开源项目已经成为IT行业的核心组成部分.像Redis.Nginx.SQLite.Elasticsearch这些知名的 ...
- 痛定思痛,好好做人,从头过一遍PyTorch框架(一)(1.深度学习简介、2.预备知识)
现在是2024年2月24日,13:59,从研一就开始断断续续说要过一遍框架,到现在博一下学期,还一直拖着呢,拖延症太可怕啦,决定好好做人,不拖了,就从现在开始,好好过一遍,呜呜呜呜呜呜呜呜,(罪该万死 ...
- cortex-m3 m4 异常机制
文章写的很好,待整理 1.[STM32]HardFault问题详细分析及调试笔记 https://blog.csdn.net/m0_54916619/article/details/129979222 ...
- 初步认识uboot
1. uboot下载地址 ftp://ftp.denx.de/pub/u-boot/
- [namespace hdk] Balanced_tree 整合
代码 #include<bits/stdc++.h> using namespace std; namespace hdk{ namespace balanced_tree{ const ...
- AMBA总线协议(一)——一文看懂APB总线协议
0.AMBA总线概括 AMBA(Advanced Microcontroller Bus Architecture) 总线是由ARM公司提出的一种开放性的片上总线标准,它独立于处理器和工艺技术,具有高 ...
- druid连接池报错:sql injection violation, multi-statement not allow
druid连接池报错:sql injection violation, multi-statement not allow 需要配置druid的 multi-statement-allow属性为tru ...