ImageViewer.tsx 734 B

12345678910111213141516171819202122232425262728293031323334
  1. import React from 'react';
  2. import { Image } from 'antd';
  3. import defaultPosition from 'src/assets/imgs/default-position.png';
  4. interface ImageViewerProps {
  5. src: string;
  6. alt?: string;
  7. className?: string;
  8. onClick?: () => void;
  9. onDoubleClick?: () => void; // 🆕 添加双击属性
  10. }
  11. const ImageViewer: React.FC<ImageViewerProps> = ({
  12. src,
  13. alt,
  14. className,
  15. onClick,
  16. onDoubleClick, // 🆕
  17. }) => {
  18. return (
  19. <div className={`image-viewer ${className}`}>
  20. <Image
  21. src={src}
  22. alt={alt}
  23. onClick={onClick}
  24. onDoubleClick={onDoubleClick} // 🆕 传递双击事件
  25. preview={false}
  26. fallback={defaultPosition}
  27. />
  28. </div>
  29. );
  30. };
  31. export default ImageViewer;