Gallery.jsx (react-lazy-load-component example)

Gallery.jsx

import React from 'react';
import { LazyLoadImage, trackWindowScroll }
  from 'react-lazy-load-image-component';

const Gallery = ({ images, scrollPosition }) => (
  <div>
    {images.map((image) =>
      <LazyLoadImage
        key={image.key}
        alt={image.alt}
        height={image.height}
        // Make sure to pass down the scrollPosition, this
        // will be used by the component to know it must
        // not subscribe to the scroll/resize events
        scrollPosition={scrollPosition}
        src={image.src}
        width={image.width} />
    )}
  </div>
);

// Wrap Gallery with trackWindowScroll HOC so it receives
// a scrollPosition prop to pass down to the images
export default trackWindowScroll(Gallery);