如何在MenuItem中添加TooTip

import React, { useState } from 'react';
import Tooltip from 'your-tooltip-library'; // 替换为你使用的Tooltip组件库

const MenuItem = () => {
  const [showTooltip, setShowTooltip] = useState(false);

  const handleMouseEnter = () => {
    setShowTooltip(true);
  };

  const handleMouseLeave = () => {
    setShowTooltip(false);
  };

  return (
    <div>
      <div onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>
        Menu Item
      </div>
      {showTooltip && (
        <Tooltip content="This is a tooltip" position="bottom">
          {/* Tooltip的内容和样式可以根据实际情况进行自定义 */}
          <div>Tooltip Content</div>
        </Tooltip>
      )}
    </div>
  );
};

export default MenuItem;