首页 > 其他分享 >elementui 动态table表头

elementui 动态table表头

时间:2023-01-06 09:55:31浏览次数:36  
标签:tableHeader elementui 表头 key table 动态

<el-table
      size="mini"
      :stripe="false"
      :header-cell-style="{'background':'#d3e0ff'}"
      :row-class-name="rowClass"
      :data="tableData"
      :span-method="objectSpanMethod"
      border
      style="width: 100%; margin-top: 20px">
      <template v-for="item in tableHeader">
        <el-table-column
            :fixed="item.key == 'itemNo' || item.key == 'itemName' || item.key == 'amount'"
            :key="item.key"
            :label="item.label"
            align="center">
          <template slot-scope="scope">
              <span>{{ scope.row[item.key] }}</span>
          </template>
        </el-table-column>
      </template>
    </el-table>
<script>
export default {
    data() {
      return {
        tableHeader:[{
            label:'项目编号',
            key:'itemNo'
        },......],
      };
    },
}
</script>    

 

标签:tableHeader,elementui,表头,key,table,动态
From: https://www.cnblogs.com/zyfenblog/p/17029520.html

相关文章

  • Android笔记--报错AUTOINCREMENT is only allowed on an INTEGER PRIMARY KEY in "cre
    问题描述每次一运行,APP程序必定闪退,百度了发现,闪退问题绝大多数就跟sql语句有关;看到控制台报出这样的错误:百度发现,我忘记了最初的知识点:在表里面,自动递增是在数据类型......
  • 使用嵌套的ScriptableObject及ReorderableList创建习题持久化数据
    使用嵌套的ScriptableObject及ReorderableList创建习题持久化数据效果展示题集持久化数据:存储题目,可以直接在inspector面板上创建对应的问题子项问题持久化数据:源码......
  • Android中RelativeLayout及TableLayout使用说明
    RelativeLayout用到的一些重要的属性:第一类:属性值为true或falseandroid:layout_centerHrizontal水平居中android:layout_centerVertical垂直居中android:layout_centerIn......
  • el-table 固定列错位问题
    1.问题描述:el-table使用固定列时,使用keep-alive后页面切换导致该列错位。2.解决方法:使用el-table的doLayout方法对表格进行重新布局activated(){this.$nextTi......
  • C# 哈希表(Hashtable)
    原文链接:http://edu.jb51.net/csharp/csharp-collection-hashtable.htmlHashtable类代表了一系列基于键的哈希代码组织起来的键/值对。它使用键来访问集合中的元素。当......
  • 基于vue+Element Table 表格的封装
    项目场景:项目场景:需要频繁使用列表进行呈现数据,不可能每次都写一个表格,可以将表格封装为一个组件,在需要使用时可以直接调用。效果展示:项目结构:具体实现:Table.vue......
  • 解决element table列错位问题
    方法一:可以解决elementtable的列错位问题/deep/.el-table--borderth.gutter:last-of-type{display:table-cell!important;}方法二:拿到数据请求结果后,使用elem......
  • LeoZhangJing [Oracle19C 数据库管理] CREATE TABLE创建数据库
    使用CREATEDATABASE创建数据库CDBDEV,ContainerDatabase。在oracle用户下创建脚本[oracle@ol8-19~]$viCrCDBDEV.sql输入以下内容:CREATEDATABASEcdbdevUSERsy......
  • C# List<T> 转 DataTable 方法修改版
    之前写了个 List<T>item.toDataTable()这种链式调用的List<T>转换为DataTable的方法,有两位热心的网友提出了存在的一些缺陷,如果传入的obj参数不是List而是单个object对......
  • TableMASTER-mmocr运行环境搭建
    TableMASTER-mmocr运行环境搭建pwd:TableMASTER-mmocr-master#conda环境condacreate-nrecordpython=3.81.pytorch#pytorch1.10CUDA10.2pipinstalltorch......