React imagesLoaded

React bindings for imagesLoaded event system

 

Props

| Name | Type |
| ---------- | ---------------- |
| onAlways | Function |
| onProgress | Function |
| onFail | Function |
| done | Function |
| background | String / Boolean |

Example usage

``js
// ES6
import ImagesLoaded from 'react-images-loaded';

// ES5
const ImagesLoaded = require('react-images-loaded');
`

`js
class App extends Component {
handleOnAlways = instance => {};

handleOnProgress = (instance, image) => {};

handleOnFail = instance => {};

handleDone = instance => {};

render() {
return (
elementType={'ul'} // defaults to 'div'
className={'your-container-class'} // defaults to 'images-loaded-container'
onAlways={this.handleOnAlways}
onProgress={this.handleOnProgress}
onFail={this.handleOnFail}
done={this.handleDone}
background=".image" // true or child selector
>
{/ Your images /}

);
}
}
`

Install for local development

Defaulting to yarn, but npm works just as well.

`
$ git clone https://github.com/oyvindhermansen/react-images-loaded.git
$ cd react-images-loaded
$ yarn install
`

#### Testing

This project is using jest as testing framework.

#### Storybook

This project is using storybook as UI testing framework.

yarn test for running the tests one time.
yarn test:watch` for running tests in watch mode

#### Contribute

Feel free to make pull requests or issues if something doesn't work or could be better :)