根据vue写出一个表格展示，可以自定义表格单个格子颜色

好的，以下是一个带有自定义单元格颜色的 Vue 表格展示示例：

<template>
  <table>
    <thead>
      <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="person in people" :key="person.id">
        <td :style="{ backgroundColor: person.color }">{{ person.name }}</td>
        <td :style="{ backgroundColor: person.color }">{{ person.age }}</td>
        <td :style="{ backgroundColor: person.color }">{{ person.gender }}</td>
      </tr>
    </tbody>
  </table>
</template>

<script>
  export default {
    data() {
      return {
        people: [
          { id: 1, name: '张三', age: 20, gender: '男', color: 'red' },
          { id: 2, name: '李四', age: 25, gender: '女', color: 'green' },
          { id: 3, name: '王五', age: 30, gender: '男', color: 'blue' }
        ]
      }
    }
  }
</script>

在上面的示例中，我们使用了 Vue 的 `v-for` 指令来遍历 `people` 数组，并使用 `:key` 绑定每个人的唯一 ID。然后，我们在模板中使用 `:style` 绑定每个单元格的背景颜色，颜色值来自于每个人对象中的 `color` 属性。您可以根据需要更改颜色值来自定义每个单元格的颜色。