simple-react-image
is a React component of <img>
tag, to gracefully loading large images. Additionally it accepts two optional props, fallback and errorImage. Fallback will be displayed when image will be loading and errorImage will be displyed on any error happend while loading image
Install
npm install --save simple-react-image
or,
yarn add simple-react-image
Prop | type | desciption | required |
---|---|---|---|
fallback |
string | loading image | no |
errorImage |
string | image on error | no |
onStateChange |
function | called on loading state change | no |
all img tags props
Usage
import { Image as Img } from 'simple-react-image';
<Img
src={"https://images.pexels.com/photos/813011/pexels-photo-813011.jpeg"}
/>
<Img
src={"https://images.pexels.com/photos/813011/pexels-photo-813011.jpeg"}
fallback="loading image url"
errorImage='image displyed on error'
onStateChange={(state)=>{
console.log(state)
}}
/>