当前位置:   article > 正文

el-table 修改多级表头背景色_header-row-style设置背景颜色

header-row-style设置背景颜色

先看效果图: 

利用组件自带属性header-row-style来完成。注意一定不要全局设置表头颜色,因为全局设置必须加!important,这样我们就无法覆盖了。

若项目有其他表格要设置背景色,可以通过在el-table中添加这句话就可以了,一行代码也不费劲,:header-cell-style="{background:'#fffaee'}"

  1. <el-table ref="dateTable" :data="tableData" :header-cell-style="tableHeaderColor" border stripe>
  2. // 修改表头颜色
  3. tableHeaderColor ({ rowIndex, columnIndex }) {
  4. if (rowIndex === 0 && columnIndex === 0) {
  5. return { background: '#fffaee' }
  6. } else if (rowIndex === 0 && columnIndex !== 0) {
  7. return { background: '#FFBD7C', border: '0' }
  8. } else {
  9. return { background: '#fffaee' }
  10. }
  11. },

好啦,就酱紫吧,拜拜~~~~

本文内容由网友自发贡献,转载请注明出处:https://www.wpsshop.cn/w/煮酒与君饮/article/detail/965168
推荐阅读
相关标签
  

闽ICP备14008679号