el-table组件自定义设置单元格样式

时间:2025-03-03 08:12:29

ElementUI中el-table组件自定义设置单元格样式_我的椰子啊的博客-****博客_elementui 设置单元格样式(element-ui)el-table表格使用cell-style改变单元格样式_weixin_51063441的博客-****博客_el-table的cell-style

直接绑定在el-table标签上
 
:cell-style="changeCellStyle"

 在methods方法里定义

一个判断row里面的值,再一个判断column里面的属性就可以为某个单元格设置样式了 

// 表体字体颜色设置
/***
 * row为某一行的除操作外的全部数据
 * column为某一列的属性
 * rowIndex为某一行(从0开始数起)
 * columnIndex为某一列(从0开始数起)
 */
 
一个判断row里面的值,再一个判断column里面的属性就可以为某个单元格设置样式了
 
cellStyle({ row, column, rowIndex, columnIndex }) {
      if (==1 && columnIndex == 6) {//设置单个
        return 'color: #FF3B4B'
      }
      if (==1 && columnIndex == 7) {
        return 'color: #FF3B4B'
      }
  },

2.
// 高亮错误信息
    setTableCellStyle({ row, column, rowIndex, columnIndex }) {
      if () {
        if ( == "guangZhou") {
          return "background:red";
        }
      }
}