• eltable 根据后台返回数据动态显示列


    从后台得到的数据:

    titleMap中的数据为表头数据

    key是0的对应 dataList 中的C0的值

    显示要求

                let listArr = [{}]
                let dataList = res.data.dataList
                let titleMap = res.data.titleMap
    
                let length = 0;
                for(let ever in titleMap) {
                  length++;
                }
                for (let i = 0; i < length; i++){
                  let label = "C"+i
                  if(titleMap.hasOwnProperty(i)){
                    listArr[0][label]= titleMap[i]
                  }
                }
    
                let dataArr = listArr.concat(dataList)            

    dataArr 数据如下:

    el-table中循环如下:
    <el-table id="productTable" :data="dataArr" border style=" 99%" :header-cell-style="tableHeaderColor" :cell-style="cellStyle" show-summary>
                    <el-table-column prop="orgName" align="center" label="站点名称"></el-table-column>
                    <el-table-column prop="treatmentSum" align="center" label="治疗台次" sortable></el-table-column>
    
                    <el-table-column :label="item" align="center" v-for="(item, index) in dataArr[0]" :key="index">
                        <template slot-scope="scope">
                            <span>{{scope.row[index]}}</span>
                        </template>
                    </el-table-column>
    
                </el-table>
    tableHeaderColor({ row, column, rowIndex, columnIndex }) {
            if (rowIndex === 0) {
              return "color: #4f81bd;font-weight: bold ;";
            }
          },
          cellStyle({ row, column, rowIndex, columnIndex }) {
            if (rowIndex === 0) {
              return "display: none;";
            }else {
    
            }
          },

    OK啦!!!!!!

  • 相关阅读:
    与WinRT组件进行操作
    clr via c# 运行时序列化
    clr via c# 程序集加载和反射(2)
    clr via c# 程序集加载和反射集(一)
    clr via c# clr寄宿和AppDomain (一)
    cir from c# 托管堆和垃圾回收
    浏览器页面的生命周期
    C#常用泛型集合
    Params修饰符
    ASP.net应用程序的生命周期
  • 原文地址:https://www.cnblogs.com/weiweiyeyu/p/16129723.html
Copyright © 2020-2023  润新知