zoukankan      html  css  js  c++  java
  • el-table单元格样式更改

    前几天遇到一个关于el-table表格样式的问题一直没解决 

    因为在el-table-column加样式并不生效所以更改起来比较麻烦

    后来了看来element官方文档和在一些关于此方面的博客,使用了一个比较笨的方法解决了问题

    问题如下:我想要未开药品的字段的样式为灰色

     效果如下

     解决方案如下:

    首先在el-table中加入cell-style

     <el-table  :cell-style="set_cell_style" >

    对于cell-style官方文档解释如下

     然后在method方法中写上方法

     set_cell_style({row, column, rowIndex, columnIndex}){
          console.log(row,"row")
            if (column.label === '时间'){
            return 'color:black'
        }
           if (column.label === '序号'){
            return 'color:black'
        }
    //这里的medicalCommonName指的是在el-table-column定义的prop中的值
    if (row.medicalCommonName === '未开药品'){ return 'color:lightgray' } },

    思路就是先让不需要改变的列字体变为黑色,因为第三个if会使得整行的字体变为灰色,所以要先把列变为黑色。这里的优先级跟if的先后顺序有关,越先定义优先级越高,所以这里定义的顺序挺重要的。

    虽然这种方法有点笨但最后还是能够解决问题的,不知道有没有更好的方法。

  • 相关阅读:
    四轴PID思路整理
    STM32输入捕获TIM2四通道
    四轴和遥控器的对应
    四层板学习(二)
    四层板学习(一)布线前的准备
    冲突的处理方法
    散列表
    重设置电脑时间
    深圳销量统计源码分析
    源码分析
  • 原文地址:https://www.cnblogs.com/wazy999/p/11812653.html
Copyright © 2011-2022 走看看