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 合并同类项并输出后台返回数据的更多相关文章

  1. 后台返回数据为map集合,前端js处理方法

    当后台返回的数据不是json而是map集合的时候,前端js中处理就将其看作是一个数组,例如后台返回的代码入下: Map<String, String> result = new HashM ...

  2. 后台返回数据判断是http还是后台本地图片 indexOf

    今天的笔记呢,记录一下 其实这个应该后台去判断的,但是因为某种原因,今天我们前台做一下判断 事情是这样的,后台返回我一个url  这个url有的http开头的 也有他后台本地的例如:/img/1.pn ...

  3. AFN请求后台返回数据为NSInlineData类型的处理

    在利用AFN进行数据解析时出现返回数据为 <7b227374 61747573 223a302c 226d6573 73616765 223a22e6 82a8e79a 84e6898b e69 ...

  4. 后台返回数据事null时怎么进行判断

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #454545 } p. ...

  5. 如何利用fis3来模拟后台返回数据

    Node 版本要求 0.8.x,0.10.x, 0.12.x,4.x,6.x,不在此列表中的版本不予支持.最新版本 node 支持会第一时间跟进,支持后更新支持列表 1.安装fis3 npm inst ...

  6. jquery输出ajax返回数据中的时间戳转化为日期时间的函数

    //第一种 function getLocalTime(nS) { ).toLocaleString().replace(/:\d{,}$/,' '); } alert(getLocalTime()) ...

  7. 前端模拟后台返回数据之Mockjs

    一.官方文档: https://github.com/nuysoft/Mock/wiki/Syntax-Specification 例子:http://mockjs.com/examples.html ...

  8. 后台返回数据为treeList结构,如何添加属性(递归添加属性)

    给tree形json数据添加默写属性(递归)addAttr(data){ for (var j = 0; j < data.length; j++) { data[j].title = data ...

  9. ajax中的后台返回数据data的意义

  10. 怎么解析后台返回数据中\r\n换行

      给div添加css样式, white-space: pre-wrap; 即可   文章来源:刘俊涛的博客 欢迎关注公众号.留言.评论,一起学习. _________________________ ...

随机推荐

  1. TypeScript 高级教程 – 把 TypeScript 当编程语言使用 (第二篇)

    前言 上一篇, 我们提到, TypeScript 进阶有 3 个阶段. 第一阶段是 "把 TypeScript 当强类型语言使用", 我们已经介绍完了. 第二阶段是 "把 ...

  2. windbg配置问题汇总(记录)

    .loadby sos.dll mscorwks.symfix c:\windows\symbols windbg配置问题汇总 1.Failed to find runtime DLL (clr.dl ...

  3. java基础 -IO流笔记

    610,文件的基础知识 文件流 输入流和输出流都是相对 java程序内存 而言 611,创建文件 在D盘下创建文件. package com.hspedu.file; import org.junit ...

  4. java_day2_常量,变量,数据类型,运算符

    一.常量 常量:在Java程序运行过程中其值不能发生改变的量 分类: 1.字面值常量: 整数常量 表示所有的整数,包括负数 10 -8 小数常量 表示所有的小数 1.23 -3.14 布尔常量 tru ...

  5. 致敬传奇 Kruskal 重构树题硬控我三小时

    NOI2018 归程 存边的数组拿来干两件事,忘了清空了,其实最好开两个的 dfs 没开 vis 导致不知道为什么出现的绕圈 倍增的 fa[i][j] 定义的时候前面是 \(2^{i}\) 写着写着记 ...

  6. 【赵渝强老师】Redis案例分析:用setbit统计活跃用户

    一.需求背景 首先,我们来看一下需求:网站统计用户登录的次数,具体如下: 网站有1亿个用户,有经常登录的,也有不经常登录的 如何来记录用户的登录信息 如何查询活跃用户:比如:一周内,登录3次的 二.使 ...

  7. window配置onnxruntime,运行c++版本

    为了使用ONNX-Runtime-Inference这个项目,但是我缺少onnxruntime这个库, 网上找了很多教程,但是大多数都是关于linux的,这里简单记录一下我的配置流程 找到onnxru ...

  8. Nodejs C++插件(N-API)

    Nodejs C++插件(N-API) 0. 环境搭建 1. JS中调用C++方法 1.1 JS中调用源文件的C++方法 1.2 JS中调用动态库的C++方法 2. C++中调用JS方法 2.1. C ...

  9. efcode相关操作

    1. 下载 tool dotnet tool install -g dotnet-ef 2. 第一次迁移日志 dotnet ef migrations add init1 3. 更新数据库 datne ...

  10. 58. vue常用的api

    1. nextTick  使用场景:通过异步渲染的页面解构不能直接dom操作,要使用 nextTick (延迟回调)等待一下 :nextTick 的作用:感知dom的更新完成,类似于 updated ...