ant-vue table中姓名列的 鼠标移入改变字体颜色，请写出代码

以下是实现鼠标移入table中姓名列改变字体颜色的代码：

1. 在表格的columns选项中添加customRender函数，用于自定义渲染姓名列：

columns: [
  { title: '姓名', dataIndex: 'name', customRender: (text, record, index) => this.customNameRender(text, record, index) },
  { title: '年龄', dataIndex: 'age' },
  { title: '地址', dataIndex: 'address' },
  // 其他列...
]

2. 在Vue实例中定义customNameRender函数，该函数接收3个参数：text表示当前单元格文本，record表示当前行数据，index表示当前行索引。在函数中添加鼠标移入移出事件，并根据事件来改变字体颜色：

customNameRender(text, record, index) {
  return {
    children: text, // 表格中显示的文本
    on: {
      mouseenter: (event) => {
        // 鼠标移入事件，修改字体颜色为红色
        event.target.style.color = 'red';
      },
      mouseleave: (event) => {
        // 鼠标移出事件，修改字体颜色为黑色
        event.target.style.color = 'black';
      }
    }
  };
}

3. 以上代码中修改字体颜色的方式为直接操作DOM元素。如果您使用了Ant Design Vue，可以使用它提供的一些样式类来实现字体颜色的修改，如下：

<template>
  <a-tooltip :title="record.name">
    <span :class="[isNameHover ? 'name-hover' : '']" @mouseenter="isNameHover = true" @mouseleave="isNameHover = false">{{ record.name }}</span>
  </a-tooltip>
</template>

<script>
  export default {
    data() {
      return {
        isNameHover: false
      }
    }
  }
</script>

<style>
  .name-hover {
    color: red;
  }
</style>