antd table 点击获取行id更改样式

在使用 antd table 的时候，我们可以通过监听表格行的点击事件来获取当前行的 id，然后再根据需要更改该行的样式。具体步骤如下：

1. 在表格上添加行点击事件监听器，可以使用 onRow 或者 onRowClick 属性来实现，其中 onRow 传入的参数是当前行的数据对象，我们可以从中获取行 id。例如：

<Table dataSource={dataSource} onRow={(record, index) => ({
   onClick: () => onRowClick(record.id) // 点击时调用 onRowClick 函数，并传入当前行 id
  })}
>
  // 省略 Table.Column 代码
</Table>

2. 编写 onRowClick 函数，用于根据传入的行 id 更改行样式。例如：

const onRowClick = (id) => {
  const row = document.getElementById(`row_${id}`) // 获取当前行的 DOM 元素
  row.classList.toggle('active') // 使用 classList.toggle 方法切换样式
}

在上述代码中，我们通过传入的行 id 获取当前行的 DOM 元素，并使用 classList.toggle 方法切换该行的样式。

3. 编写 CSS 样式，用于设置行的选中样式。例如：

.active {
  background-color: #f5f5f5;
}

在上述代码中，我们使用 .active 选择器来定义选中行的样式，可以根据实际需求来定义样式。

通过以上步骤，我们可以在 antd table 中实现点击获取行 id 并更改样式的功能。