是否根据行的当前活动键值更改行背景颜色？

import React, { useState } from 'react';

const TableRow = ({ rowData, isActive }) => {
  const rowClass = isActive ? 'active-row' : 'inactive-row';
  return (
    <tr className={rowClass}>
      {rowData.map((cell, index) => (
        <td key={index}>{cell}</td>
      ))}
    </tr>
  );
};

const Table = () => {
  const [activeKey, setActiveKey] = useState(null);
  const data = [
    ['Row1-Cell1', 'Row1-Cell2'],
    ['Row2-Cell1', 'Row2-Cell2'],
    // 更多数据...
  ];

  return (
    <table>
      <tbody>
        {data.map((row, index) => (
          <TableRow
            key={index}
            rowData={row}
            isActive={activeKey === index}
            onClick={() => setActiveKey(index)}
          />
        ))}
      </tbody>
    </table>
  );
};

export default Table;

.active-row {
  background-color: #aaffaa; /* 活动行的背景颜色 */
}

.inactive-row {
  background-color: #ffffff; /* 非活动行的背景颜色 */
}