需求：根据某一个单元格中的某个条件不同，设置动态的颜色；

思路：通过官方文档提供的customCell进行判断设置不同的颜色背景，案例中进行了简单的行列判断，同学们可以根据自己的需求修改判断条件，动态实现不同的单元格背景颜色的变化；

效果图：

测试案例：

<template><a-table :columns="columns" :dataSource="data" rowKey="id" />
</template><script setup lang="ts">
import { ref } from "vue";const data = ref([{ id: 1, name: "John Doe", score: 85, age: 28 },{ id: 2, name: "Jane Smith", score: 92, age: 32 },{ id: 3, name: "Alice Johnson", score: 60, age: 23 },
]);const columns = [{title: "Name",dataIndex: "name",key: "name",customCell: (record, rowIndex) => {// 为第二行的 "Name" 列设置背景颜色if (rowIndex === 1) {return { style: { backgroundColor: "lightblue" } };}return {};},},{title: "Score",dataIndex: "score",key: "score",customCell: (record, rowIndex) => {// 为第一行的 "Score" 列设置背景颜色if (rowIndex === 0) {return { style: { backgroundColor: "lightgreen" } };}return {};},},{title: "Age",dataIndex: "age",key: "age",customCell: (record, rowIndex) => {// 为第三行的 "Age" 列设置背景颜色if (rowIndex === 2) {return { style: { backgroundColor: "lightcoral" } };}return {};},},
];
</script>