npm.io
1.0.13 • Published 3 years ago

simple-react-image

Licence
MIT
Version
1.0.13
Deps
0
Size
42 kB
Vulns
0
Weekly
0

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

demo 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)
    }}
    />

Demo

Check Demo here

Keywords