vue根据某列数据值的不同，实现行背景颜色变化

开发工具：WebStorm
前端技术：vue + element ui + vue router + axios + vuex

环境搭建过程不再描述

进入正题:如何根据某列数据值的不同，实现行背景颜色变化
相关代码：

<template>
<section>
<el-table :data="list" highlight-current-row v-loading="listLoading" :cell-class-name="checkDel" style="width: 100%;">
      <el-table-column type="selection" width="55"/>
      <el-table-column label="test1" prop="test1" sortable>
      </el-table-column>
      <el-table-column label="test2" prop="test2" sortable>
      </el-table-column>
      <el-table-column label="test3" prop="test3" sortable>
    </el-table-column>
      <el-table-column label="test4" prop="test4" sortable>
      </el-table-column>
</el-table>
</section>
</template>

<script>
export default {
methods: {
checkDel({row, column, rowIndex, columnIndex}){
        if (this.list[rowIndex].test1==判断条件)){
          return 'red'
        }
      },
}
}
</script>

<style>
  .el-table .red{
    background: #F5F5DC;
  }
</style>

效果：