el-table 增加表格样式,固定表头

<el-table

         :data="arrList"

         border

         :cell-style="addClass"

         style="width: 100%;"

         :max-height="tableHeight"

         :span-method="arraySpanMethodActual">

</el-table>

1. el-table中增加  :cell-style="addClass"  属性

2. js中使用 addClass 这个方法,想怎么加样式就怎么加

        addClass({row,column,rowIndex,columnIndex}){

                 if(row[2].includes('合计')){

                    return columnIndex == 1 ? 'background: #F5F7FA;font-weight: bold;' : 'background:                                 #F5F7FA;';

                 }

                 if(columnIndex == 0) {

                    return 'background: #F5F7FA;';

                 }

      },

3.固定表头用的是 :max-height="tableHeight" 这个属性,加上高度一块使用

computed: {

      contentHeight: {

         get () { return this.$store.state.common.contentHeight }

      },

      tableHeight(){

         var height = this.contentHeight - 230;

         return height + ""

      }

   },

  • 7
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值