React-Imager
The imager is used to replace tag, and it will lazy to load the picture.
Installation and usage
Install
npm install -S react-imager
Then use it in your app:
import React from 'react';
import Img from 'react-imager';
class App extends React.Component {
successCallback(){
}
render() {
return (
<Img
src="./expamle.png"
thumbSrc="./thumb.png"
className="demo"/>
onSuccess={this.successCallback}
);
}
}
Props
It has all the attributes of the <img> tag, such as:
- src
- style
- className
- alt
- thumbSrc: display before the src is loaded
- errorSrc: display while load src failed
- onSuccess: callback after the image is successfully loaded
- onFailed: callback after the image is failed loaded
License
MIT License
Keywords
react image lazyload img