Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-lazysizes

yourname54MIT1.0.0

LazySizes component base on lazysizes plugin.

react-component, react, component, react-lazysizes, lazysizes, lazyload, image-lazyload

readme

React LazySizes

LazySizes component for ReactJS base on lazysizes

Installation

NPM

npm install --save react-lazysizes

Bower

bower install --save react-lazysizes

Usage

JS

var LazySizes = require('react-lazysizes');

<LazySizes width='1920' height='1024' dataSrc='http://lorempixel.com/1920/1024/sports/1'/>

UMD

<script src="path/to/react-lazysizes/dist/react-lazysizes.js"></script>
//...
var LazySizes = window.ReactLazysizes;
//...

Example here

Props

Name Type Default
src string 'data:image/gif;base64,R0lGODdhEAAJAIAAAMLCwsLCwiwAAAAAEAAJAAACCoSPqcvtD6OclBUAOw=='
dataSrc string
dataSizes string 'auto'
dataSrcSet [string, object, array]
className string ''
iframe bool false

More info see lazysizes api.

Example

View demo or example folder.