dromru / react-photoswipe-gallery

🏙 React component wrapper around PhotoSwipe
https://dromru.github.io/react-photoswipe-gallery/
MIT License
499 stars 28 forks source link

React image lightbox features #1231

Open pj-alvarado10 opened 1 year ago

pj-alvarado10 commented 1 year ago

Hi. I knew this library by react-image-lightbox, because it is deprecated but recommende you. I try to use react photoswipe gallery the same way to lightbox because I have already a slider with images and I only need to open the lightbox (I don't need add a gallery).

I need a solution similar to this ( get by stackoverflow ):

return (
     <div>
      <Slider {...settings}>
        { images.map(image => (
           <img src={image} onClick={ e => this.handleClickImage(e, image)}  />

        ))} 
      </Slider>

      {current &&
         <Lightbox
            mainSrc={current}
            onCloseRequest={this.handleCloseModal}
            />
      }
    </div>
   )

I supposed that how Lightbox mentioned you then you have similar feature... With Gallery-Item tags I can't avoid add the gallery and use only the lightbox feature, I don't find similar tool in your documentation. Then I have the question if you have it.

nguyentranhau98 commented 8 months ago

Try to wrap it with the . Works for me

return (
     <Gallery>
      <Slider {...settings}>
        { images.map(image => (
        <Item>
           {({ ref, open }) => <img ref={ref} src={image} onClick={open}  />}
       </Item>
        ))} 
      </Slider>
    </Gallery>
   )