如何跟随表中某些列的数据来显示工具提示？

import React, { useState } from 'react';
import { Table } from 'react-bootstrap';

const MyTable = () => {
  const [tooltipData, setTooltipData] = useState('');

  const handleMouseOver = (data) => {
    setTooltipData(data);
  };

  const handleMouseOut = () => {
    setTooltipData('');
  };

  return (
    <Table>
      <thead>
        <tr>
          <th>列1</th>
          <th>列2</th>
          <th>列3</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td onMouseOver={() => handleMouseOver('数据1')} onMouseOut={handleMouseOut}>数据1</td>
          <td onMouseOver={() => handleMouseOver('数据2')} onMouseOut={handleMouseOut}>数据2</td>
          <td onMouseOver={() => handleMouseOver('数据3')} onMouseOut={handleMouseOut}>数据3</td>
        </tr>
      </tbody>
    </Table>
    {tooltipData && (
      <div className="tooltip">
        {tooltipData}
      </div>
    )}
  );
};

export default MyTable;