Description:
A React wrapper around the Photoswipe, which helps you create configurable and flexible galleries in your app.
Basic usage:
1. Install and import the component.
# Yarn $ yarn add react-photoswipe-gallery # NPM $ npm i react-photoswipe-gallery
import 'photoswipe/dist/photoswipe.css'
import { Gallery, Item } from 'react-photoswipe-gallery'2. Create a basic gallery.
const MyGallery = () => (
<Gallery>
<Item
original="1.jpg"
thumbnail="thumb-1.jpg"
width="1024"
height="768"
>
{({ ref, open }) => (
<img ref={ref} onClick={open} src="thumb-1.jpg" />
)}
</Item>
<Item
original="2.jpg"
thumbnail="thumb-2.jpg"
width="1024"
height="768"
>
{({ ref, open }) => (
<img ref={ref} onClick={open} src="thumb-2.jpg" />
)}
</Item>
</Gallery>
)Preview:
