如何在react中预览多张图片？我可以预览一个，但不能预览多个

import React, { useState } from 'react';

const MyComponent = () => {
  const [images, setImages] = useState([]);

  // 其他组件代码...

  return (
    // JSX代码...
  );
}

export default MyComponent;

import React, { useState } from 'react';

const MyComponent = () => {
  const [images, setImages] = useState([]);

  const handleImageClick = (index) => {
    // 在这里更新预览图片的状态
  };

  return (
    <div>
      {images.map((image, index) => (
        <img
          key={index}
          src={image}
          alt={`Image ${index}`}
          onClick={() => handleImageClick(index)}
        />
      ))}
    </div>
  );
}

export default MyComponent;

import React, { useState } from 'react';
import Lightbox from 'react-images';

const MyComponent = () => {
  const [images, setImages] = useState([]);
  const [currentImage, setCurrentImage] = useState(0);
  const [lightboxIsOpen, setLightboxIsOpen] = useState(false);

  const handleImageClick = (index) => {
    setCurrentImage(index);
    setLightboxIsOpen(true);
  };

  const closeLightbox = () => {
    setCurrentImage(0);
    setLightboxIsOpen(false);
  };

  return (
    <div>
      {images.map((image, index) => (
        <img
          key={index}
          src={image}
          alt={`Image ${index}`}
          onClick={() => handleImageClick(index)}
        />
      ))}

      <Lightbox
        images={images.map((image) => ({ src: image }))}
        currentIndex={currentImage}
        isOpen={lightboxIsOpen}
        onClose={closeLightbox}
      />
    </div>
  );
}

export default MyComponent;