PC端react图片预览组件base64

你可以使用react-image-gallery或者react-image-lightbox这些库来实现图片预览功能。这些库都支持base64图片的预览。以下是一个简单的示例：

import React, { useState } from 'react';
import ImageGallery from 'react-image-gallery';

function PreviewComponent({ images }) {
  const [previewIndex, setPreviewIndex] = useState(0);

  const handlePreview = (index) => {
    setPreviewIndex(index);
  };

  return (
    <ImageGallery
      items={images}
      showPlayButton={false}
      showFullscreenButton={false}
      startIndex={previewIndex}
      onSlide={handlePreview}
    />
  );
}

export default PreviewComponent;

在这个示例中，我们使用了`react-image-gallery`库来实现图片预览功能。传递给组件的`images`属性是一个包含图片信息的数组，每个图片信息都应该包含图片的url和base64编码。当用户点击预览时，我们更新`previewIndex`状态，使其指向用户点击的图片。最后，我们将`previewIndex`状态传递给`ImageGallery`组件，以便它可以显示正确的图片。