zoukankan      html  css  js  c++  java
  • 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方法是对月份展示的一个处理,这样就可以正确输出数据了
  • 相关阅读:
    小程序登陆流程解析
    小程序连续点击bug解决
    小程序开发文本空格的添加
    微信小程序转支付宝小程序
    支付宝小程序开发入门
    微信小程序开发入门
    text属性
    小程序横向滚动
    will-change
    Docker 系列二(操作镜像).
  • 原文地址:https://www.cnblogs.com/florazeng/p/14041156.html
Copyright © 2011-2022 走看看