el-table表格el-table-column根据不同的值，动态显示不同的颜色

需求：表格列有多个状态，不同的状态展示不同的颜色，这个时候用三目运算符不太方便，可以用computed计算属性

示例：

template模板中：

<el-table-column prop="totalGrade" label="自评得分" align="center">
      <template slot-scope="scope">
        <span :style="classObje(scope.row.totalGrade)">
          <i
            :class="scope.row.totalGrade < 0 ? 'el-icon-bottom' : 'el-icon-top'"
          ></i>
          {{ scope.row.totalGrade }}分
        </span>
      </template>
    </el-table-column>

computed中：

 computed: {
    classObje(totalGrade) {
      return (totalGrade) => {
        if (totalGrade < 0) {
          return { color: "red" };
        } else if (totalGrade === 0) {
          return { color: "#000000" };
        } else if (totalGrade > 0) {
          return { color: "#13ce66" };
        }
      };
    },
  },

效果图：