react-progressive-img
v0.0.16
Published
> Progressive image rendering made easy
Downloads
36
Readme
react-progressive-img
Progressive image rendering made easy
Install
$ yarn add react-progressive-img
Usage
default
import ProgressiveImg from 'react-progressive-img';
<ProgressiveImg
src="https://your-site/some-image.png"
/>
all props
import ProgressiveImg from 'react-progressive-img';
<ProgressiveImg
src="https://your-site/some-image.png"
dimensions={{width: '100%', height: 150}}
/>
render props
import ProgressiveImg from 'react-progressive-img';
<ProgressiveImg src="https://your-site/some-image.png" >
{(state, percentage, src) => {
if (state === 'error') {
return <div>Error</div>;
} else if (state === 'complete') {
return <img src={src} />;
} else {
return <div>Loading {percentage}%</div>;
}
}}